JOVANAEducation
← All styles
N° 32 · 2020 — present · macOS Big Sur · Win 11 · iOS 26

Glassmorphism

— frosted-glass panels, layered over saturated colour —
◐ blur · 28px ◑

Frosted glass's translucency, applied to the interface —
the colour beneath shows through, but the content stays clear.

At WWDC in June 2020, Apple unveiled macOS Big Sur — pushing the 'vibrancy' it had used since 2014 across the whole system. Window backgrounds blur, the Dock turns translucent, Control Center floats above the wallpaper. The same year Microsoft adopted 'Mica' and 'Acrylic' materials throughout Windows 11. In 2025 Apple officially named it 'Liquid Glass' — the system aesthetic's official name from iOS 26 on.

It solved a problem Flat Design didn't: when everything is pure colour, the sense of hierarchy disappears — you can't tell which panel floats on top and which sits beneath. Glassmorphism uses the fact that it 'lets the colour below show through' to visualize z-index.

The key to doing it well is 'there must be something underneath to show through': glass on a pure-white base just looks like a pale grey block. It needs a saturated, layered, colourful background (wallpaper, video, gradient) to refract. And you can't stack glass on glass on glass — past three layers you can't tell which is in front.

Today its strongest uses: the system OS layer (Windows, macOS, iOS), video-player overlay UI (YouTube full-screen controls), and dashboard floating panels. Using it on a product's main screen actually disrupts reading — it's a supporting actor, not the lead.

backdrop-filter: blur20—40px blur30—50% opacitycolorful background1px border highlightvibrancy / saturation
Weather · CupertinoNow
68°
Mostly Sunny · L 58° H 72°
Pomodoro · focus
22:14
Now Playing♥ ⋯
Midnight City
M83 · Hurry Up, We're Dreaming
2020
macOS Big Sur
Apple
2021
Windows 11 · Mica
Microsoft · Fluent
2024 —
visionOS spatial UI
Apple Vision Pro
2025
iOS 26 · Liquid Glass
Apple