soconnor/personal-website
1
0
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

Add Apple liquid glass inspiration and design constraints to blog post

Browse Source
This commit is contained in:
Sean O'Connor
2026-05-11 02:02:18 -04:00
parent ba9ce7d790
commit 1bfa45ea1b
1 changed files with 2 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/content/blog/design-system.mdx
+2
View File
@@ -9,6 +9,8 @@ export const metadata = {
Most developer portfolios look the same: flat white, rigid grid, card borders at full opacity. That's fine — it's readable and it works — but I wanted this site to feel a bit more considered. Here's what I actually changed and why. Most developer portfolios look the same: flat white, rigid grid, card borders at full opacity. That's fine — it's readable and it works — but I wanted this site to feel a bit more considered. Here's what I actually changed and why.
The starting point was Apple's liquid glass — the frosted, layered surfaces they've been pushing across visionOS and iOS 26. I liked the idea but not the constraints: it's a heavy effect, tied to specific rendering hardware, and not something you can cleanly port to a web project without it feeling like a theme rather than a system. I wanted something simpler, familiar enough that it doesn't distract, and performant enough that I could reuse it across multiple projects without thinking twice. The result is less "liquid glass" and more "glass-adjacent" — translucent surfaces, soft blur, a moving background that gives everything something to sit on top of.
## Background ## Background
The background is a fixed layer sitting behind everything at `z-index: -10`. It has two parts. The background is a fixed layer sitting behind everything at `z-index: -10`. It has two parts.