688: Modern CSS Round-Out Tabs, OpenUI, and Why Websites?
Episode
55 min
Read time
2 min
Topics
Design & UX
AI-Generated Summary
Key Takeaways
- ✓CSS Shape Primitive: The new `shape()` function replaces `path()` with CSS-native syntax supporting pixels, rems, calc, and variables—enabling flexible tab designs where curves adjust automatically to content width and height using mixed static and calculated coordinates.
- ✓Single-Direction Overflow Control: CSS now supports `overflow-inline: auto` combined with `overflow-block: clip` to enable horizontal scrolling while preventing vertical overflow, solving previously impossible layout scenarios where elements extend beyond containers in only one direction.
- ✓QuietUI Component Strategy: Corey LaViska's web component library includes novel "gimmick" components like flip-cards, joysticks, QR codes, and typewriter effects alongside standard UI elements, plus a restyle sheet that themes native HTML to match custom components using shared tokens.
- ✓Source-Available Licensing Model: QuietUI uses Polyform non-commercial license requiring payment for commercial use, Discord access, and priority bug fixes while allowing free non-commercial modification—distinguishing "source available" from true open source to monetize spare-time development.
What It Covers
Chris Coyier demonstrates modern CSS shape primitives for creating rounded-out tabs without images, explores QuietUI web component library's unique features, and debates website viability beyond pure commerce applications.
Key Questions Answered
- •CSS Shape Primitive: The new `shape()` function replaces `path()` with CSS-native syntax supporting pixels, rems, calc, and variables—enabling flexible tab designs where curves adjust automatically to content width and height using mixed static and calculated coordinates.
- •Single-Direction Overflow Control: CSS now supports `overflow-inline: auto` combined with `overflow-block: clip` to enable horizontal scrolling while preventing vertical overflow, solving previously impossible layout scenarios where elements extend beyond containers in only one direction.
- •QuietUI Component Strategy: Corey LaViska's web component library includes novel "gimmick" components like flip-cards, joysticks, QR codes, and typewriter effects alongside standard UI elements, plus a restyle sheet that themes native HTML to match custom components using shared tokens.
- •Source-Available Licensing Model: QuietUI uses Polyform non-commercial license requiring payment for commercial use, Discord access, and priority bug fixes while allowing free non-commercial modification—distinguishing "source available" from true open source to monetize spare-time development.
Notable Moment
Coyier reveals he maintains a tagged Notion database of unwritten topics, deliberately connecting multiple items per article as a brain exercise, producing weekly content for CodePen while guest posting elsewhere to manage his unstoppable writing compulsion.
You just read a 3-minute summary of a 52-minute episode.
Get Shop Talk Show summarized like this every Monday — plus up to 2 more podcasts, free.
Pick Your Podcasts — FreeKeep Reading
More from Shop Talk Show
724: Ask Dan Abramov Anything About AT Proto
Jul 20 · 55 min
Modern Wisdom
How TikTok Hijacked The Future Of Music - Nik Nocturnal - #1095
May 9
More from Shop Talk Show
723: Ads on Your Website, UX for Web Dev Jobs, and Progressive Web Components
Jul 13 · 57 min
Hard Fork
Moltbook Mania Explained
Feb 4
Books, tools, and gear mentioned in this episode
SignalCast may earn commission on purchases via these links.
Tools
“Coyier reveals he maintains a tagged Notion database of unwritten topics, deliberately connecting multiple items per article as a brain exercise, producing weekly content for CodePen while guest posting elsewhere.”
by Corey LaViska
“Corey LaViska's web component library includes novel "gimmick" components like flip-cards, joysticks, QR codes, and typewriter effects alongside standard UI elements, plus a restyle sheet that themes native HTML to match custom components using shared tokens.”
company
“Coyier reveals he maintains a tagged Notion database of unwritten topics, deliberately connecting multiple items per article as a brain exercise, producing weekly content for CodePen while guest posting elsewhere to manage his unstoppable writing compulsion.”
More from Shop Talk Show
We summarize every new episode. Want them in your inbox?
724: Ask Dan Abramov Anything About AT Proto
723: Ads on Your Website, UX for Web Dev Jobs, and Progressive Web Components
722: The No-AI Talk Challenge, Picking Rails Tooling, Dark Mode?
721: New Gear, Nerding Out, and VS Code Forks
720: TypeScript Complaints, Slowing Down, and AT Proto Protocols
Similar Episodes
Related episodes from other podcasts
Modern Wisdom
May 9
How TikTok Hijacked The Future Of Music - Nik Nocturnal - #1095
Hard Fork
Feb 4
Moltbook Mania Explained
ZOE Science & Nutrition
Dec 4
Healthier holiday eating with smart food swaps | Dr Federica Amati
The Peter Attia Drive
Dec 1
#374 - The evolutionary biology of testosterone: how it shapes male development and sex-based behavioral differences, | Carole Hooven, Ph.D.
Making Sense
Apr 7
#406 — The Legacy of Christianity
Explore Related Topics
This podcast is featured in Best Cybersecurity Podcasts (2026) — ranked and reviewed with AI summaries.
You're clearly into Shop Talk Show.
Every Monday, we deliver AI summaries of the latest episodes from Shop Talk Show and 192+ other podcasts. Free for one show.
Start My Monday DigestNo credit card · Unsubscribe anytime