A deep dive into creating a personal blog using Next.js 16, atomic design principles, and a warm flannel-inspired color palette with glass morphism effects.
So basically, I wanted to build a blog that felt both modern and personal. Here's how I approached it.
The foundation is pretty straightforward:
The visual language borrows from 90's flannel colors—warm, earthy tones that feel personal without being overly styled. Glass morphism effects add depth without cluttering the interface.
// Example: Glass effect utility classes
const cardStyles = 'glass hover:glass-heavy transition-all';If that makes sense, the glass effects create hierarchy through blur and opacity rather than traditional borders and shadows.
I'll be adding more interactive components and exploring how to blend magazine-style layouts with modern web patterns.
Tags
Walter writes about software engineering, development experiences, and technical explorations with a conversational, first-principles approach.
Tags