CSS and design systems people - BlogFlock

Stylex At Shopify - Adam Argyle

2026-09-03T19:55:34.000Z

Did a deep dive to see if StyleX would work at Shopify.

Turned out to be a wash, similar to my other explorations into OOCSS.

Small things like these - Robin Rendle

2026-08-23T20:39:41.000Z

Claire Keegan’s novella Small things like these is very sweet and the ending is so triumphant and satisfying and punk rock that it’s going to stay with me for a very long time. I leave this rare book recommendation without a quote or much of a description simply because I don’t want to ruin anything. But what I will spoil is that Keegan’s writing is clear and precise, like ice made in laboratory conditions.

I spotted this interview that captures how she writes:

“A lot of my work goes into taking any traces of my labours out,” says Keegan, when I talk to her in Edinburgh, a few hours after she gave a reading at the city's book festival. “It's essentially about trusting in the reader's intelligence rather than labouring a point. To work on the level of suggestion is what I aim for in all my writing. There are so many things the short story cannot do; it's by learning those limitations that I am cornered into writing what I can.”

Cybernetics and Ghosts - Robin Rendle

2026-08-23T17:07:06.000Z

In November 1967 Italo Calvino gave a lecture called Cybernetics and Ghosts where he talked about writing machines and the future of literature:

...will we have a machine capable of replacing the poet and the author? Just as we already have machines that can read [...] will we also have machines capable of conceiving and composing poems and novels?

I am thinking of a writing machine that would bring to the page all those things that we are accustomed to consider as the most jealously guarded attributes of our psychological life, of our daily experience, our unpredictable changes of mood and inner elations, despairs and moments of illumination.

I didn’t expect Calvino (of all folks!) to be comforted by a machine that could write If on Winter’s Night A Traveler, but ok:

...what I instinctively feel is a sense of relief, of security. The same sort of relief and sense of security that I feel every time I discover that a mess of vague and indeterminate lines turns out to be a precise geometric form; or every time I succeed in discerning a series of facts, and choices to be made out of a finite number of possibilities, in the otherwise shapeless avalanche of events. Faced with the vertigo of what is countless, unclassifiable, in a state of flux, I feel reassured by what is finite, “discrete,” and reduced to a system.

So if a computer can take writing, language, and the messiness of putting words together and do that work for us, Calvino believes it might remove all the dark magic out of literature. Or if a machine can process writing into a series of operations like a program then making a novel or a poem won’t be as frightening for us? That’s a weird take that I don’t fully get it, but it’s an interesting idea I guess?

I have to admit that whenever folks start to talk like this I feel this desperate need to defend personhood, humanity, novels, the humanities, liberal arts, books, all of it. My hackles go up reading this stuff because it’s usually coming from folks who don’t know anything about writing or literature and it feels like they’re stomping all over a vulnerable and delicate thing that they don’t understand.

But when Calvino says it we ought to pay attention.

Although, when he finds solace in literature being reduced into a series of rules and regulations, I feel great relief knowing that this is impossible. I love the mystery of novel-making. I want it to be this impossible thing. I hate all the rules and regulations of writing and want to break them in the same way that all great novels do. There are no rules! And that, to me, is liberating, exciting even.

But just as I was about to dismiss Italo as a traitor to the cause—a backstabbing, synth-sympathizer—he does the rather lovely thing that Italo always does. He hops around, tries this idea on for a moment, before jumping out of a closet with an altogether opposite-shaped idea that makes you smile:

The struggle of literature is in fact a struggle to escape from the confines of language; it stretches out from the utmost limits of what can be said; what stirs literature is the call and attraction of what is not in the dictionary.

After this 180, Calvino leaves the lecture in an oddly hopeful place by the end. He wants the machine to remove the mystery out of literature, to tell us all the rules and copy all the styles, only so that we can see those rules clearly. Then, Calvino argues, we can study them, break them.

And make something entirely new.

WWW Ep251 Guppy Pimpin In Trip Pants While Debugging Ie5 - Adam Argyle

2026-08-18T17:24:04.000Z

Ep #251
Guppy Pimpin In Trip Pants While Debugging IE5

Robbie and I do a mostly whatnot episode about our path getting into tech, playing in bands, and getting into trouble. We sip Glen Morangie "A Tale of Ice Cream" and share some stories.

⤷ whiskey.fm · youtube · spotify · apple

Scotch Malt Whisky Society Member - Adam Argyle

2026-08-16T04:38:35.000Z

New member of the Scotch Malt Whisky Society

The day of small things - Robin Rendle

2026-08-15T16:12:06.000Z

I spotted this quote by Shirley Hibberd on the side of an enormous glass case, just outside the departures gate at SFO:

Let us not despise the day of small things. A windowsill garden is better than no garden, and the dark area where cats quarrel and damp makes patches of unsightly mould, may be made bright with healthy vegetation that shall be worth a little care and very much love.

This lovely quote is from Shirley’s book, published in 1870, called Rustic Adornments for Homes of Taste and just look at this punk thing. For all the lovely feel-good-vibes and gardening advice of that quote above, it’s clear that this book is a cursed object that beckons from beyond our realm. Although, making a gardening book exclusively for goths like me is kinda neat.

Anyway, Shirley’s quote, the glass case, and the whole exhibit at SFO is called Indoor Eden: Victorian Jardinières and I feel like it was setup exclusively to ruin my day. The exhibit is a celebration of art nouveau Victorian pottery and I can’t think of much else in life that we should be actively rooting against: stumpy dark green leaves fold over ceramic fish with their mouths wide open; an ugly brown vase stands proud with a few ugly dandelions haphazardly carved into it; a psychedelic, gaping-wound-red butterfly has been stamped onto a tall pot that’s perched on an equally upsetting, even taller pot.

It’s all just profoundly ugly. Overly complicated. Frilly. The colors are wrong. All the pots on display beg for attention in a way that feels embarrassing, reminding me of stuffy rooms in England with silverware locked in cabinets and nice china brought out for special occasions. Or it reminds me of pictures of the Queen printed on tacky plates and all the weird romanticism in England about what the Victorian era was, and what the Empire did. Each piece in these glass cases fail so profoundly and in such remarkable ways that it draws me in, pulls me close. For a while I forget where I am, that I’m at the airport to say goodbye to my father in-law, and instead I’m locked in an eternal death stare with these ugly 150 year old pots.

I know, I know. This meanness is unpleasant and these ugly things are expertly made and technically competent beyond anything I could ever manage with my enormous sausage fingers and terrible hand-eye coordination. A lot of care and attention, decades of experience, was poured into making these objects. But a bad song or a bad movie or a bad anything is still bad, despite the effort made.

Here’s how I excuse myself when being a grump.

When I complain I’m honoring the effort of whoever made these things by trying to understand why I hate them. It’s genuinely interesting to me! A lot of folks dismiss their hatred or are mean about what they dislike in boastful ways but I want to understand why and how these things suck. I want to learn more about them in the hope that I can avoid making anything like it. It’s useful information about myself, like knowing that I’m never going to enjoy karaoke. It’s just too late, okay? I’m thirty six years old and I’ve spent enough time pretending to have a good time singing Shania Twain. It’s ok to hate karaoke! Let me live!

Back at the airport, I chuckle to myself.

Shirley is trying to be nice. In her book and in that quote she’s trying to remind me that great things can come from small problems. That all I have to do is tidy up, clean up a garden, remove a weed, or do small things for the sake of small things. But here I am—a total grump—despising the smallness of these acts. I want to yell at Shirley: no, actually, a windowsill is not better than a garden goddammit. A damp patch in your house is gross and instead of fixing it you should run away, get a new apartment, burn the place to the ground. Small, ugly things should be unacceptable. Fix this minor inconvenience by changing everything about your life and move a thousand miles away, change your name, forget everyone you love, adopt a whole new identity.

And please, for the love of all that his holy in this world, stop making these goddamn Victorian Jardinières.

(Ahem. Sorry, Shirley).

Websub - Adam Argyle

2026-08-13T06:31:25.000Z

WebSub support added.

Creativity On The Internet At Sxsw - Adam Argyle

2026-08-13T05:01:20.000Z

Jack (CEO of Patreon) gives a great talk about the struggles of being an artist with the internet from the 90s to today, a history of tech and art, and lessons learned.

Heartfelt insights into working through 2026 "content creation" culture.

Watch on YouTube.

Contextualism At CSSday 2026 - Adam Argyle

2026-08-12T18:26:00.000Z

Watch my talk "Contextualism" from CSS Day on Conffab

2026 Open Agentic Tools - Adam Argyle

2026-08-10T16:52:03.000Z

Some "open" agentic tools:

Wonder if they use Open Props 😏

Scroll Axis Lock - Adam Argyle

2026-08-10T16:04:51.000Z

I first noticed web scroll areas had scroll locking behavior when making 2D scroll snap demos; I couldn't scroll diagonally without getting hijacked and locked into an x or y axis.

Even on a touch device, where a diagonal gesture is so easy and natural.

See the Pen by Adam Argyle (@argyleink) on CodePen.

Thanks to Bramus's rad interactive blog post I saw Chrome 153 with the remedy:

.scroller {
  overflow: auto;
  overscroll-behavior: contain;
  scroll-axis-lock: none; 👈
}

spec | check for support

Freedom from the axis lock 🤘🏻

Use cases #

I was thinking:

swipe to dismiss interactions
flings
maps or infinite canvas navigating
datagrids or tables
image zoom scrolling around
360 pano images or 3D model panning
data vis exploration

Just seems worth while to use the natural inertia, tensions, perf and feels that scroll snap has for the snap feedback of "didnt swipe far enough" and the browser owned easing.

Can also mitigate scrollTo strangeness that might do x then y.

I did log a bug #

I saw some performance regressions in the first 2 demo's I pulled up to test with

Filed a bug.

I wouldn't necessarily file this as perfectly fixed, I still felt it was a bit clumsy or not enabling diagonal scrolling as smoothly as I'd like.

Overall exciting and meaningful IMO tho.

Your thoughts?

Ranting Devigner - Adam Argyle

2026-08-08T05:46:10.000Z

My Blogspot in 2011: Ranting Devigner

see what tech articles I was reading ^lol
dev and design rants I was making ^{also lol}

Devigner = Designer + Developer
Before "Design Engineer" was coo

Kevin Powell Trying Out Prop For That - Adam Argyle

2026-08-05T15:11:07.000Z

Kevin Powell tries out Prop For That, makin it look so slick and easy 🫶

Watch on YouTube

Max Value Of A CSS Length Layout Unit - Adam Argyle

2026-08-05T14:53:20.000Z

33554432px

the maximum value for a CSS length in a layout context. #randomCSSfacts

Bramus on Masto

WWW Ep250 With Christina Martinez - Adam Argyle

2026-08-03T20:55:45.000Z

Ep #250
Live at React Miami with Christina Martinez

Robbie, Christina and I chat fun coding experiments, personifying agents, OpenClaw, hot takes and a little bit of whatnot.

⤷ whiskey.fm · youtube · spotify · apple

Reading matters deeply - Robin Rendle

2026-08-02T22:23:40.000Z

Mandy Brown:

...reading isn’t about reaching empathic dead ends, or recruiting platitudes about how we must understand each other [...] To reduce reading to the practice of empathy is to divorce it of its real power and pleasure: to enjoy the fruits of another person’s creative effort, to think with the writer and their characters, not becoming them, but becoming more fully yourself.

Show me the work - Robin Rendle

2026-08-01T18:05:07.000Z

Whenever someone tries to impress me with a job title I feel sorry for them. Like when a child tries to impress me by explaining that “Wolverine is cool.” Look, kid: I basically invented Wolverine. I’ve been thinking about Wolverine since before you were born. Wolverine and me are best buds how dare you come to me with these childish facts. Have you seen my t-shirt? My Wolverine-themed chain wallet? My sick yellow socks? I know everything about Logan — see, we’re on a first name basis here — and he calls me all the time to ask how I’m doing. He was the best man at my wedding. So do I know that Wolverine is cool? Go back to school and get yourself an education.

Ahem. Anyway, like I said, I’ve always felt pity for folks with ridiculous job titles but I hadn’t really been able to put this feeling into words until I heard AOC answer a question about running for president in 2028:

What’s funny about that, they assume that my ambition is positional. They assume that my ambition is a title or a seat, and my ambition is way bigger than that. My ambition is to change this country.

Presidents come and go, senate house seats, elected officials...all come and go. But single payer healthcare is forever.

I can’t put into words how much I admire this. Although sure, a title might be nice. It might communicate what level you are, or help barter for more money and power. It might get you a better job. But I’d argue that those are the jobs you don’t want. Constantly vying for attention and glory is the best way for the work to suck.

Most fields have figured this out: even the biggest bozo in the world is unlikely to introduce themselves as a Senior Staff Principal Novelist, or a Lead Poet, or an AI-Native Movie Director. But in the software design field there’s a total lack of shame. Someone will shake your hand with the most pathetic, lick-spittle job title in a vain attempt to impress or intimidate, to place themselves above you in a deeply lame, invisible hierarchy.

So let’s get serious here: Wolverine does not introduce himself as an AI-Native Senior Principal X-Boy.

He’s just fucking Wolverine, my dude.

CSS Infinity Use Cases - Adam Argyle

2026-07-25T19:57:08.000Z

CSS infinity (and -infinity!) solve some pretty specific problems elegantly, but can also just be plain fun to use.

Showing support for infinity, -infinity, NaN, pi, and e

Lets spur creative CSS juices with infinity and follow a couple use cases.

Basics and gotchas #

infinity and -infinity need to always be wrapped in calc().

If you want it to represent a dimension, it also needs to be multiplied by a unit like:

div {
  border-radius: calc(infinity * 1px);
  z-index: calc(infinity);
}

Not quite limited to calc() too, you can use it with other calc()-like scenarios like clamp(), min(), max(), etc, which we'll dig into a bit 🤘🏻

1. Circles and Pills #

Before infinity, I would have used scientific notation like 1e9px (which is 1000000000px) to create a "big enough" radius for circles and pills at any size.

But with infinity..!?

.radius-full {
  border-radius: calc(infinity * 1px);
}

2. Perma-state #

Setting duration calc(infinity * 1s) makes an animation/transition so long that it appears to be frozen ⛄️

Hover over those boxes and the duration will be pinned to happen over infinity seconds, sticking the state for the duration of the page's life.

I like how the duration of your hover is permanently made visible too. Visible millisecond duration via background color.

3. z-index #

Need to beat z-index: 999999999 or something?

.tippy-top-of-stacking-context {
  z-index: calc(infinity)
}

This will max out at the largest int a browser allows: 2147483647. Speaking of that number, you can see it by using counters like this:

.css-max-int {
  counter-reset: cssInt calc(infinity);

  &::after {
    content: counter(cssInt);
  }
}

See!

4. To infinity and beyond #

Use calc(infinity * 1px) to remove the floor or ceiling of a clamp.

div {
  inline-size: clamp(
    calc(-infinity * 1px), /* no floor */
    100%, 
    calc(infinity * 1px)   /* no ceiling */
  );
}

5. Freeze view transitions #

Make view transitions never complete.

::view-transition-group(*),
::view-transition-old(*),
::view-transition-new(*) {
  animation-duration: calc(infinity * 1s);
}

The ::view-transition tree stays in the devtools DOM, giving you an opportunity to inspect or tweak.

6. Bools #

Clamp an arbitrary number down to exactly 0 or 1, then use it:

.flippy {
  --active: 0;
  --on: clamp(0, var(--active) * infinity, 1);

  background: hsl(200 80% calc(50% - var(--on) * 20%));
  translate: 0 calc(var(--on) * -10px);

  &:active {
    --active: 1;
  }
}

One variable now can drive color, offset, opacity, gaps, whatever.

Flip with classes, media queries, etc, anything that can toggle a variable can become the moment a different style choice is made.

7. Backdrop #

You can use the spread feature of box-shadow to create a non-interactive backdrop:

.backdrop {
  box-shadow: 0 0 0 calc(infinity * 1px) #0005;
}

Paint past the "entire viewport".

8. Scroll Trigger #

Trigger a scroll driven transition in, and never transition out.

.nav-title {
  timeline-trigger-activation-range-end: calc(infinity * 1px);
}

.product-title {
  animation: slide-and-fade 150ms ease both;
  animation-trigger: play-forwards play-backwards;
}

Though you'll see in the demo I use scroll 100% which is a specced way that feels closer to the intent I was going for, in that I wanted the range end to be the end of the scroll area.

Try it:

See the Pen by Adam Argyle (@argyleink) on CodePen.

Also, just for funsies to share, here's the scroll driven version of the same navbar effect. Doesn't use infinity, but fun to try and compare scroll-triggered vs scroll-driven animation.

See the Pen by Adam Argyle (@argyleink) on CodePen.

Thats all #

Hope you found that interesting!

Comment with your own creative uses of infinity?

WWW Ep249 With Joel Hooks - Adam Argyle

2026-07-23T19:57:08.000Z

Ep #249
Live at React Miami with Joel Hooks

Robbie, Joel and I chat about Pi, OpenClaw, JoelClaw, YOLO mode, AGI, custom harnesses and a little bit of whatnot.

⤷ whiskey.fm · youtube · spotify · apple

100 Ways To Center A Div - Adam Argyle

2026-07-21T02:46:06.000Z

100 ways to center a div
by Temani Afif