finds.dev← search

// the find

developedbyed/glass-website

★ 923 · CSS · updated May 2024

A single-page glassmorphism demo site built as a YouTube tutorial companion. It's a static HTML/CSS exercise showing frosted-glass card effects — nothing more. Audience is beginners learning CSS backdrop-filter tricks.

The backdrop-filter + blur combination is implemented cleanly without vendor-prefix noise. Card hover states use transform and box-shadow in a way that doesn't cause layout reflow. Good reference for how rgba backgrounds interact with backdrop-filter to produce the glass look.

One HTML file and one CSS file with no abstraction — not reusable in any real project without a full rewrite. No CSS custom properties for the glass effect values, so tweaking blur radius or opacity means hunting through the stylesheet. backdrop-filter has historically poor Firefox support and there's no fallback. The asset images are game screenshots with no licensing info, making this a copy-paste trap for anyone who wants to ship something.

View on GitHub →

// want more like this?

We dig through GitHub every week and send a few repos picked for what you actually care about — each with an honest take like this one.

Get finds in your inbox → Search again →