Reading List
It happened again. My phone’s browser accumulated over 350 open tabs and I had to take a stand. Armed with an indulgent beverage, I spent my evening in front of the fireplace closing all the junk then triaged the remaining candidates for the ultimate prize: eternal life in this blog post.
I’ve gone ahead and roughly grouped these but it’s more art than science, as many belong to multiple groups or don’t really fit in anywhere.
Reading List
UX
Design
- Uchū Color Palette - A simple, bright, and fun color palette
- What the Heck is a Design Engineer? - Podcast with Dave Darnes
General
- Quick and Dirty Colour Palettes Using color-mix
- The Gap in CSS Layout - Ahmad Shadeed
- View Transitions Demo with Credit Card UI - Great credit card UI. The animations are nicely done too.
- How to Create Neon Text with CSS - CSS-Tricks - I was toying with the idea of adding a Tron theme and to do that I’d, of course, need lots of neon effects.
- Understanding backdrop-filter in CSS - Josh Comeau
- Squish - Compress and convert your images - I’m still preferential to squoosh but I have a soft spot for image compression tools and had to check it out.
- The UX of Login Codes - Brad Frost - Glad someone put into words all the pain points around login codes that we all feel.
Motion/Animation
- Scroll-Driven Animations Demos Collection - A great collection of scroll-driven animations. I could see myself using “Cover Flow”, “Cover Card to Fixed Header”, and “Shrinking Header + Shadow”
- Animations.dev - Web Animation Resource
- View Transitions Staggering - Frontend Masters - tldr; clever use of animation-delay with nth child. I’ looking forward to the future
sibling-count()
andsibling-index()
support.animation-delay: calc(var(--stagger-duration) * (sibling-index()) / sibling-count());
is so much better. - Scroll Buddy - Focus Furnace Tool
Squircles
- Desperately Seeking Squircles - Figma Blog
- Bringing iOS 7’s Squircles to CSS
- Implementing Smooth Shapes in UI Design
Snippets / Tutorials
- Animated CSS Accordions (with rotating image)
- How to Build a Copy Code Snippet Button
- Custom Range Slider Using Anchor Positioning
- CSS Star Rating Implementation
- Pure CSS transparent animated gradient border with glow
- Best Light/Dark Mode Theme Toggle with JavaScript
Web Component Loading
Frontend Dev Tooling, and Tools for Frontend
Performance
- Input Delay Measurement Tool
- Lightning Fast Web Performance - WebPageTest Guide
- Testing for Locally Installed Fonts
- Improving INP on Next.js Without RSC
- Improving Rendering with CSS content-visibility - Nolan Lawson
- Client-Side Rendering Flame Graph Explained
- Why We Ditched Next.js - Northflank Blog
Web Foundations, Platform and Browsers
- Navigating the Web Platform - Patrick Brosset
- Web We Want - Browser Vendor Wishlist
- How Browsers Really Load Web Pages - FOSDEM 2025
- So You Want to Push a Web Platform Feature?
- CSS Values and Units Level 5 - attr() Notation Draft
- CSS Custom Functions Teaser - Bram.us
- The Future of CSS: Light/Dark Mode Color Switching
Open source I may find a use for
- diff2html - Pretty HTML Diff Viewer
- React Libraries Roundup - Robin Wieruch
- Dashy - Dashboard for Self-Hosted Services
LLMs & AI
- My LLM Code Generation Workflow - Harper Blog
- Creating an App in Under 20 Hours with AI
- Using LLMs to Extract Structured Data from Text
- View Transitions with AI - Builder.io Blog
- Rork App - AI Tool
- Vo.dev - AI Development Platform
- Replit - Collaborative Coding Platform
Other
- The Rabbit Hole - Kevin Roose - Haven’t read it yet, but sounded interesting. “an in-depth exploration of what happens when our lives move online”
- How I Ease the Next Developer Reading My Code
- UmbrelOS - Excellent UX Reference - I thought it was a well-designed landing page, though scrolling has occasional jank.
Newsletters / Blogs
- Frontend Engineering Explained - ShadowDOM & More
- Mark Erikson’s Blog on React/Redux
- Nerd Show and Tell - Meet Lea Verou Podcast