Gratis · Ontwerp en CSS
Liquid Glass CSS-generator.
Maak panelen in de Liquid Glass-stijl van Apple met CSS: vervaging, verzadiging, tint, randlicht, schaduw en optionele SVG-breking, met live voorbeeld.
Loading the calculator…
Zo gebruik je deze tool: Liquid Glass CSS-generator
Voer gegevens in of kies een bestand. Pas de instellingen aan, maak het resultaat en controleer het voordat je het kopieert of downloadt.
Limieten en ondersteunde formaten
Je invoer wordt op je apparaat verwerkt.
Technische opmerkingen in het Engels
Refraction works in Chromium only; other browsers keep the blur. Everything is calculated in your browser; nothing you type is uploaded.
backdrop-filter blurs and saturates what is behind the element; inset shadows draw the bright and dark edges; an optional SVG feDisplacementMap bends the background.
The “iOS 26 style” preset gives a 28 px card with blur(14px) saturate(180%), a 12 % white tint and a bright top edge.