Before building Glassmorphism Generator, we visited glassmorphism.com — the site literally run by the designer who coined the term "glassmorphism" — and used its own official generator directly.
Three sliders. No color anywhere.
The Settings panel has exactly three controls: Blur value, Refraction, and Depth. We looked for a color picker and found none. The generated CSS's background is permanently rgba(255, 255, 255, 0.15) — every card is white-tinted glass, full stop. Want a colored glass card, or a dark-mode frosted panel? You're editing the CSS by hand.
And an unprompted login popup
Without clicking anything, a "Hello there! Log into the academy" modal appeared over the page while we were just trying to use the free generator.
A second competitor: sliders with no visible numbers
We also checked css.glass, which does have a color slider alongside Transparency, Blur, and Outline. But document.querySelectorAll('input') in its console returned zero — every slider is a custom-built element with no numeric readout anywhere. The only way to know an exact value is to read the raw CSS text at the bottom and reverse-engineer it.
What this tool does differently
Pick any tint color — the generated CSS's background comes out as whatever rgba() you actually chose, not a hardcoded white. Every slider (tint opacity, blur, border opacity, corner radius) shows its live value right next to it and has a matching number input you can type into directly. No login, no account, nothing.
