Jared talks with Stephen Margheim about a “missing” middle layer in modern design systems: reusable CSS affordances that sit between Tailwind utilities and full components. Stephen shares how building a no-JavaScript half-star rating input (radio buttons + labels + SVG + careful hover/layout CSS) reinforced his bias toward solving problems with the smallest toolset to avoid incidental complexity and to make solutions portable across frameworks. That philosophy leads to his critique that components are a poor vehicle for purely visual styles because they bundle structure, behavior, and aesthetics in ways that are hard to reuse—so instead, teams should name and standardize visual signals like “button” as composable classes that can apply to many semantic HTML elements. He explains how Tailwind can support this via custom utilities (@utility), tree-shaking, autocomplete, variants, and low-specificity defaults using :where(), and argues a four-layer approach—tokens → utilities → affordances → components—helps teams maintain design systems and progressively drop JavaScript as the web platform adds more native UI primitives (dialog, popover, details/name, etc.).

Links:

fractaledmind.com

Web Awesome

Font Awesome

Tailwind: Introducing Catalyst

Catalyst docs

shadcn/ui

daisyUI

Tailwind docs: Functions & directives

MDN: :where() selector

MDN: Popover API

MDN: CSS anchor positioning

MDN:

element

MDN: Invoker Commands API

MDN blog: Exclusive accordions with

web.dev: Interop 2026 proposals

Ruby on Rails

SQLite

Dead Code Podcast Links:

Mastodon

X

Jared’s Links:

Mastodon

X

twitch.tv/jardonamron

Jared’s Newsletter & Website

Episode Transcript

Hosted on Acast. See acast.com/privacy for more information.