Milchglas-CSS-Effekte visuell für Ihre Benutzeroberfläche erstellen.
Passen Sie drei Regler an – Unschärfe, Transparenz und Rahmenopazität – und beobachten Sie, wie sich der Milchglas-Effekt in Echtzeit aktualisiert. Wenn Sie mit dem Aussehen zufrieden sind, kopieren Sie das fertige CSS direkt in Ihr Stylesheet.
Verwenden Sie die drei Regler für Unschärfestärke, Transparenz und Rahmenopazität. Die Vorschau aktualisiert sich live. Kopieren Sie das generierte CSS aus dem Textfeld unten im Steuerungsbereich.
Glasmorphismus benötigt einen farbigen oder bildbasierten Hintergrund hinter dem Element. Auf einem weißen Hintergrund hat die Unschärfe nichts zum Einwirken.
Ja – in allen modernen Browsern (Chrome, Firefox, Safari, Edge). Das generierte CSS enthält automatisch das -webkit-Präfix für Safari.
Dieses Werkzeug läuft vollständig in Ihrem Browser. Nichts, was Sie eingeben oder einfügen, wird an einen Server gesendet — die gesamte Verarbeitung erfolgt lokal auf Ihrem Gerät.