CSS and design systems people - BlogFlock

An Abundance of Inspiration - Robin Rendle

2025-10-28T16:21:49.000Z

Redesigning this website over the weekend gave me a curious feeling. It was a deeply cozy one, as if my work sits on a continuum of all the other websites and books every made. As if my work is a link in a long chain through time. You’ll likely spot the inspiration right away: this redesign took an LLM copyright approach to Tschichold’s work and his rather beautiful designs for Penguin Books that are still iconic almost a century later.

There’s other inspirations in here, too. Little details, like the code blocks from Chase McCoy’s website which give an air of confidence to an otherwise empty, sad little box of code. Or you can peek under the hood into the code itself and find snippets like this one, the full-bleed CSS utility by Andy Bell:

.full-bleed {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

However, the redesign of this website has always been inspired by a new font release and this time Edgar was the one that caught my eye. It’s stately and elegant and sick. Tobias Frere-Jones and Nina Stössinger made a system that’s clearly bookish yet without feeling prudish or uptight about it.

But reading Edgar’s design notes you can follow my inspiration back and connect the dots to other sources of inspiration, too:

“Looking at Caslon again, I realized this wasn’t just some historical artifact. There was something deeper — something still very present and alive,” says Frere-Jones, who felt “an unexpectedly strong reaction” as he pored over the letterforms more intensely. “It was a kind of strange resonance, like when you play a certain note on a speaker and the windows rattle.”

That’s what inspiration is: finding an old thing and watching it move once again, discovering something else in there that you can remix. Or perhaps even rescue.

At the Art of Manga exhibition at the de Young Museum last week I could hear that same hum. With my nose smushed against the glass, zooming in as far as I could to the beautiful sketches and drawings, I could see how all this work was connected: thousands upon thousands of hours. And all of it stacked on top of more work that I couldn’t see underneath with references and inspirations looted from somewhere else then tweaked and applied in strange new ways.

Speaking of which, I’ve been reading William Gibson’s novel Neuromancer lately and it feels as if I’ve found some holy text, the source of truth for all modern sci-fi. Going in I knew the book was an inspiration to dozens of books and videogames and movies but I hadn’t quite grasped the full extent of it:

He’d operated on an almost permanent adrenaline high, a by-product of youth and proficiency, jacked into a custom cyberspace deck that projected his disembodied consciousness into the consensual hallucination that was the matrix.

I gasped as I discovered how throwaway lines or concepts that the novel introduces for a gentle dose of color and world-building have inspired enormous universes of fresh new stories: Night City, decks, eddies, “jacking in”, chrome, corpos, and the goddamn matrix just to name a few.

This was how I felt redesigning my website this time round as there was just so much inspiration that it’s become overwhelming. I want to steal basically everything from anh’s new homepage or bottle up the typographic confidence of Naz’s website. I want to distill the warm welcome of Doug’s and soak up all the the focus and sturdiness of Printing Films and then for good measure package up the ordered curiosity of Mandy’s website. And, of course, I want to put as much effort and energy into a thing as Lucas Pope put into modeling his beautiful boat.

For now this redesign will do. It’s still messy, unfinished in places. Dark mode needs a lot of work. Mobile styles look clunky, too. I’ll continue to polish the infinite-scrolling blog posts (or I’ll get sick of them in a week and quietly cut them). I might re-add an about page or more information about me since that feels a little stark and threadbare today. That stuff is always tricky to figure out though.

But this redesign was a good reminder that I’m always working amongst smart, inquisitive folks and all of them are taking inspiration from unlikely sources and adding their own thing to the mix. There is an abundance of inspiration out there—across media and genre and quirky publishing formats—and I just have to keep my eyes open to see it.

Beyond Tellerrand 2025 - Adam Argyle

2025-10-26T21:04:54.000Z

Stoked for my upcoming talk at Beyond Tellerrand in Berlin next month:

🎶 Midi Meets CSS 🎶

Most folks use WebGL to visualize their audio (and it's awesome) but that's not me, CSS is. I've taken a different approach…

Be there or be aspect-ratio: 1

WWW Ep214 Npm Worms Rubygem Coups - Adam Argyle

2025-10-21T00:20:07.000Z

Ep #214
NPM Worms & RubyGems Coups: Trust Issues in Open Source

Robbie, Chuck, and I talk about the worst whiskey, Tailwind as a “state management library,” recent security scares in open source, NPM dependency hygiene, developer visa drama, and tech salaries.

⤷ whiskey.fm · youtube · spotify · apple

Oops CSS Got Away From Me Send Halp At Cascadiajs 2025 - Adam Argyle

2025-10-12T22:32:11.000Z

You can now watch my talk from CascadiaJS 2025 3 weeks ago 🤘🏻💀

Watch on YouTube

WWW Ep213 With Kevin Powell - Adam Argyle

2025-10-09T12:23:20.000Z

Ep #213
Is CSS A programming language?

Robbie and I chat with Kevin Powell about the quirks and complexities of CSS, Tailwind and Flexbox, AI’s failure to write decent styles, anchor dingles, trim styles, and more.

⤷ whiskey.fm · youtube · spotify · apple

CSS Bluesky Feed - Adam Argyle

2025-10-04T22:44:31.000Z

On Bluesky? Here's a CSS Feed I made 🤓

Try Warp - Adam Argyle

2025-10-03T03:03:08.000Z

Still a fan of Warp, it's good stuff y'all.

On Log Rocket With Kevin And Paige - Adam Argyle

2025-10-02T19:57:24.000Z

Checkout this episode of PodRocket with Kevin Powell, Paige and I; we chat about… you guessed it, CSS!

Watch or Listen

WWW Ep212 With Dave Rupert - Adam Argyle

2025-10-02T14:29:04.000Z

Ep #212
TalkShop Show w/ Macho Man Randy Standards

Robbie and I chat with Dave Rupert about whiskey, web culture, the quirks of building side projects, the shifting landscape of the web, AI-driven development, spec-driven workflows, RSS’s decline, and more.

⤷ whiskey.fm · youtube · spotify · apple

A Rad Function To Be Excited About - Adam Argyle

2025-10-01T05:03:02.000Z

Bramus with a rad snippet:

@function --light-dark(--l, --d) {
  result: if (color-scheme(dark): var(--d); else: var(--l));
}

In 3 lines, a --light-dark() CSS function that works anywhere 🤩

Getting A Frontend Job In 2025 On Frontend Fire - Adam Argyle

2025-09-29T14:38:31.000Z

I joined the good folks on Front-End Fire to share how front-end interviewing is like in 2025, in the age of AI and short attention spans.

⤷ website · youtube · spotify · apple

Sticky Gradient Transitions - Adam Argyle

2025-09-26T15:22:13.000Z

Sticky staggered offsets + gradients = neat transition

Simple version (linear)
Trig version (curves)

Squircles - Adam Argyle

2025-09-26T03:01:58.000Z

Squircles with clip-path: shape()

Try on Codepen

Just Vite It - Adam Argyle

2025-09-25T04:27:27.000Z

Nobody wants to see your ugly config,
Just Vite It.

Scroll To Bloom - Adam Argyle

2025-09-20T18:28:51.000Z

Scroll To Bloom

SO fun.

Cascadiajs 2025 Talk - Adam Argyle

2025-09-19T19:24:09.000Z

My talk is in just a couple hours here in Seattle at CascadiaJS 🤘🏻💀

cascadiajs-2025.netlify.app

Joining Shopify - Adam Argyle

2025-09-15T17:00:00.000Z

I'm stoked to share my next role:

Design Engineer at Shopify;
alongside Jason Miller to hack on next-gen admin UI/UX and a new Polaris.

I'm also workin to rejoin the CSSWG via Shopify too 🙂

Thanks for all y'all's support! 💀🤘🏻

Twitter Integrated Again - Adam Argyle

2025-09-13T17:10:45.000Z

Twitter comments, likes and reposts are now integrated.

Ditch those words! - Robin Rendle

2025-09-13T16:18:00.000Z

Over the past couple of years I’ve noticed that 90% of my design feedback comes down to these three things:

Ditch those words!
Ditch those words!
Ditch those words!

It’s the fastest way to make a design more easily understood because almost every interface tries to explain too much at the wrong time and is far too yappy. Modern interface design is made up of sentences and sentences of needless information, over-explaining every detail and presenting too many ideas and concepts at the wrong time.

It’s strange because as an annoying book person I believe in words! I want more and more words. I want fancy words and long-winded words and difficult words. I demand complexity! I want to think and ponder and struggle with a sentence that is trying to drag me along with it on a rip-roaring ride that I can barely comprehend. This, to me, is the textbook definition of fun.

But here’s what modern UI design looks like: There’s always a confusing title; it doesn’t quickly tell me what to do or what it wants me to understand; beneath that there’s a subtitle, explaining the title again; beneath that there’s several sentences that restates the title and subtitle but simply jumbles all the words around to make it justify its existence; then the button—there is always a button—and it asks me to “Confirm” or “Apply” but as to what I’m confirming or applying I have absolutely no idea unless I go back to the text and fight my way through it all again.

Folks will spend so much time adding fancy illustrations and making sure the icons aren’t blurry but when it comes to words and actions in interfaces they seem to gloss right over them. We have learned to scan UIs like robots because the folks who designed them don’t care for the words as much as they cared for the fonts or the colors.

But words in an interface have a different job than they do in a book and behave in a different way. Every word in a UI needs to act like a hammer, with each successive word the interface should become clearer, more easily understood. If you put a word like Explore in an interface it might make sense but now add another navigation item like Discover beneath it and now both words make no sense. The UI has collapsed into meaninglessness and folks are forced to click and think and furrow their brows to understand the difference between the two. This is because words in interfaces have relationships: they all work together to build comprehension. If one button or title or navigation item is confusing then it makes everything else more confusing, too.

The cynic in me worries that the folks who made this interface don’t want me to read the popup or modal or alert or web page or list of settings or whatever and they really just want me to click a button. The words are designed to be longwinded and confusing. They just want the click. The more hopeful designer in me worries that these folks just didn’t spend the time necessary to understand what they want from me. Either way, it sucks.

So this is feedback I give to myself as I’m working on an interface today: Remove that subtitle! Make that title as brief as possible! Kill that second sentence! Make it impossible for users not to read this! Disambiguate! Separate these concepts! Hide the fluff! Say one thing! Ditch those words!

WWW Ep209 - Adam Argyle

2025-09-11T15:42:49.000Z

Ep #209
Is Cracker Barrel a JS Framework?

Robbie and I talk about JavaScript trends, from the overuse of hooks to frameworks chasing sameness, and why Cracker Barrel’s rebrand feels like a frontend metaphor.

⤷ whiskey.fm · youtube · spotify · apple