Search a title or topic

Over 20 million podcasts, powered by 

Player FM logo

Content provided by ShopTalk, Chris Coyier, and Dave Rupert. All podcast content including episodes, graphics, and podcast descriptions are uploaded and provided directly by ShopTalk, Chris Coyier, and Dave Rupert or their podcast platform partner. If you believe someone is using your copyrighted work without your permission, you can follow the process outlined here https://ppacc.player.fm/legal.
Player FM - Podcast App
Go offline with the Player FM app!

657: David Darnes on Web Components and Design Systems

1:04:51
 
Share
 

Manage episode 473027835 series 19036
Content provided by ShopTalk, Chris Coyier, and Dave Rupert. All podcast content including episodes, graphics, and podcast descriptions are uploaded and provided directly by ShopTalk, Chris Coyier, and Dave Rupert or their podcast platform partner. If you believe someone is using your copyrighted work without your permission, you can follow the process outlined here https://staging.podcastplayer.com/legal.

Show Description

David Darnes joins us to talk about his work on the Nord design system, writing web components, working with embeds and web components, thoughts on building a progress bar or notification component, keeping design systems and design tools in sync, and tricks for components and variables.

Listen on Website →

Guests

David Darnes

Guest's Main URLGuest's Social

Designer, Front-end Developer & Writer.

Links

Sponsors

Jelly

Keeping up with customer emails shouldn’t feel like flying a 747. Jelly’s team email inbox makes it easy and affordable: one flat price per team, not per user. No surprise bills—just a simple shared inbox that helps your team respond faster, stay organized, and keep customer conversations flowing smoothly. Try Jelly now for free and get 15% off!
  continue reading

465 episodes

657: David Darnes on Web Components and Design Systems

ShopTalk

17,316 subscribers

published

iconShare
 
Manage episode 473027835 series 19036
Content provided by ShopTalk, Chris Coyier, and Dave Rupert. All podcast content including episodes, graphics, and podcast descriptions are uploaded and provided directly by ShopTalk, Chris Coyier, and Dave Rupert or their podcast platform partner. If you believe someone is using your copyrighted work without your permission, you can follow the process outlined here https://staging.podcastplayer.com/legal.

Show Description

David Darnes joins us to talk about his work on the Nord design system, writing web components, working with embeds and web components, thoughts on building a progress bar or notification component, keeping design systems and design tools in sync, and tricks for components and variables.

Listen on Website →

Guests

David Darnes

Guest's Main URLGuest's Social

Designer, Front-end Developer & Writer.

Links

Sponsors

Jelly

Keeping up with customer emails shouldn’t feel like flying a 747. Jelly’s team email inbox makes it easy and affordable: one flat price per team, not per user. No surprise bills—just a simple shared inbox that helps your team respond faster, stay organized, and keep customer conversations flowing smoothly. Try Jelly now for free and get 15% off!
  continue reading

465 episodes

All episodes

×
 
Show Description Do we sound drunk on Shorts? What speed do you listen to your podcasts at? Happy Birthday to Dave, Roblox scams, having silly fun on the web, Crashlands 2 released, a Balatro moment, non-standard browser use testing, and color-mix follow up. Listen on Website → Links The Adventure Zone | Maximum Fun Don't let your voice be flattened by the über theme - daverupert.com Crashlands 2 Adam Coster: Crashlands 2 Balatro University jQuery Reunion Sponsors Webflow x GSAP Community Challenge GSAP and ALL the plugins are now FREE for everyone thanks to Webflow (even for commercial projects)! The SplitText plugin has had a complete rewrite (half the size, accessible, and smarter text splitting). To celebrate: a community challenge all through May. Make something fun and win merch! One prompt each week featuring a different (previously paid) plugin.…
 
Show Description We're talking browsers and discussing alternative options like Vivaldi and Brave, the implications of Chrome's potential sale to OpenAI, the impact of AI on browser functionality, Discord vs Circle, and building with Hotwire. Listen on Website → Links Newfangled Browser Alternatives – Frontend Masters Blog Zen Browser Horse Browser Vivaldi Browser | Powerful, Personal and Private web browser Opera GX | Gaming Browser | Opera Thorium Browser Mullvad Browser Fast and Private Web Browser DuckDuckGo Microsoft Edge Download OpenAI Chrome Acquisition Mozilla on U.S. v. Google HTML5 CSS3 Support Opera Air | Mindful Browser Opera Mini Download Hotwire Drawer Component CodePen Circle Discord Zulip Netlify Support Forums Retro Photo app Media Diet – Chris Coyier Sponsors…
 
Show Description What are the non-US cloud services options, falling off the blogging train and trying to get back on, working on vacation, Chris recaps the Alaskan Folk Festival experience, how often do you go back and clean out JavaScript, and the idea of gilding just one lily on a new project. Listen on Website → Links European Alternatives A lack of frequency increases the pressure to deliver quality Trap (2024) Reviews Polyfilling Concepts ex-Googler · April 10, 2025 Gild Just One Lily Blog Questions Challenge CodePen Development CSS clip-path maker Sponsors…
 
Show Description Follow up on thoughts about teaching CSS from scratch, questions about conferences to attend as well as a way to kickstart a conference idea, some Balatro thoughts, and our thoughts on the recent Grid vs Masonry debate. Listen on Website → Links The Homebrewery - NaturalCrit SmashingConf in-person Conferences 2025 — Friendly, inclusive & fun events for web designers and developers. - SmashingConf New York, Freiburg, Antwerp and Online Web Design Event State of the Browser 13 Bring live to life Sponsors…
 
Show Description Adam Argyle joins us to chat about new CSS features that are demo'd in a carousel configurator - a builder-like experience to help visualize the capabilities of a CSS only Carousel: buttons, markers, paging and inertness. Listen on Website → Guests Adam Argyle Guest's Main URL • Guest's Social CSS at Google. Links Chrome Canary Features Demo Space CSS Carousel Configurator Black Emperor Sponsors…
 
Show Description We're joined by Andy Bell, the founder of Set Studio. They discuss the evolution of web design, the importance of client relationships, and the innovative approaches taken at Set Studio and Piccalilli. The conversation covers the shift from traditional design methods to a more browser-centric approach, the challenges of client work, and the significance of documentation in maintaining project integrity. Andy shares insights on creating customizable design systems and the necessity of having a decision-making framework in client interactions. Listen on Website → Guests Andy Bell Guest's Main URL • Guest's Social Designer, front-end developer and the founder of Set Studio and Piccalilli. Links Pen.new mdn.io Set.Studio Front-End Development Skills Obsidian Thinking Connected Workspace The Telepathy Tapes Complete CSS If it works, it's right - Piccalilli Carousels with CSS Sponsors…
 
Show Description David Darnes joins us to talk about his work on the Nord design system, writing web components, working with embeds and web components, thoughts on building a progress bar or notification component, keeping design systems and design tools in sync, and tricks for components and variables. Listen on Website → Guests David Darnes Guest's Main URL • Guest's Social Designer, Front-end Developer & Writer. Links Nord Health Ariel Salminen Design Systems WTF Awesome Standalones DesignSystems.wtf Sponsors Jelly Keeping up with customer emails shouldn’t feel like flying a 747. Jelly’s team email inbox makes it easy and affordable: one flat price per team, not per user. No surprise bills—just a simple shared inbox that helps your team respond faster, stay organized, and keep customer conversations flowing smoothly. Try Jelly now for free and get 15% off!…
 
Show Description Onboarding users is a lot more difficult than you might think it is, how should links be coloured or styled, keeping web software up to date, why does some AI slop get created in the first place, getting context for why things happened or decisions were made, and our first bullet point dev career story (Steve's version). Listen on Website → Links Subscribe to us on YouTube! Riverside: HD Podcast & Video Software | Free Recording & Editing Automate without limits CodePen PRO Link Color Idea Ludacris Freestyle Front Tag, You're It Watch the video version of this episode Sponsors…
 
Show Description It's a speed run meeting edition episode and we're talking conspiracy theories, getting hypnotized, disinformation on TikTok vs the news, view transitions vs CSS animations vs the web animation API, follow ups on font-weight and attire, and classic autocomplete vs AI autocomplete. Listen on Website → Links SubwayTakes (@subwaytakes) | TikTok Motion - A modern animation library for JavaScript and React font-weight: 300 considered harmful | CSS-Tricks Sponsors…
 
Show Description UI and state struggles, AI missing important sand context, should we look forward to AI browsers, how bad is the mobile web in 2025, what does scalability with websites actually mean, and is there a role for someone as a project manager with tech insight? Listen on Website → Links Dribbble - Discover the World’s Top Designers & Creative Professionals UI = f(statesⁿ) - daverupert.com Welcome to Steam Thoughts on embedding alternative text metadata into images – Eric Bailey The Browser Company | Building Arc Dia from The Browser Company Perplexity teases a web browser called Comet | TechCrunch Introducing Operator | OpenAI Daring Fireball: One Bit of Anecdata That the Web Is Languishing Vis-à-Vis Native Mobile Apps Sill | Top news shared by the people you trust Sponsors…
 
Show Description We're looking at the Interop 2025 announcements, Dave is hating on (and talking about) attributes, debating better ways to handle color inputs, following up on the implications of AI that is shaped by politics, and Dave mouthblogs the secret black boxes of AI. Listen on Website → Links interop/2025/README CSS Day 2025, 5th & 6th of June, Amsterdam Interop 2025 | Igalia Miriam’s post Robin Sloan’s post Michelle Barker’s reply Baldur’s post Robin’s reply Baldur’s reply Jeremy Keith’s reply TechCrunch article OpenAI Model Spec Vale post Search Engine podcast GitHub link Sponsors…
 
Show Description Remembering the old days before we had bots, teaching kids to talk to bots, how difficult is it to build games in the browser, are we seeing LLMs get more political, what does mainstream media really mean, and have you heard about PouchDB? Listen on Website → Links PixiJS: The HTML5 Creation Engine Unreal Engine: Powerful Real-Time 3D Creation Tool Balatro: A Unique Gaming Experience Xbox Adaptive Controller: Accessibility in Gaming Designing Content Authoring Experiences by Greg Dunlap on Kickstarter Craft CMS: A Flexible Content Management System Analysis: ChatGPT’s Political Views Are Shifting Right Search Engine Podcast: Insights and Discussions PouchDB: A Pocket-Sized Database on GitHub Zero Docs: Documentation for Zero Replicache: Real-Time Data Synchronization Obsidian: Sharpen Your Thinking Sponsors…
 
Show Description Jason joins us to talk about his rebranding to CodeTV.dev, how Chris Coyier helped him become a star, the power of free, how he makes money with CodeTV, sponsorship and tech shows, crappy web cams, and the gear he uses to look and sound amazing. Listen on Website → Guests Jason Lengstorf Guest's Main URL • Guest's Social Jason Lengstorf is the producer of CodeTV.dev, where he helps tech companies connect with developer communities through better devrel strategy and media. Links tv for developers — CodeTV The Best React-Based Framework | Gatsby Scale & Ship Faster with a Composable Web Architecture | Netlify The Great British Bake Off Web Development Challenge Leet Heat Pilot TV for Developers Dropout Comedy Nebula Universe Sunny Nihilist Declaration Philosophize This! Episodes BenQ RD280UA Monitor iPhone Webcam for Mac Webcam Comparison Sony FX3 Camera ATEM Mini Sponsors BenQ Not really but you should call us Mr or Ms BenQ!…
 
Show Description Does layout make CSS difficult to learn from scratch, Chris quizzes Dave about Balatro, getting back into Pokemon, why should Google have to sell Chrome, adding fun features to apps you already have to keep you using them like Raycast, and thoughts on the VS Code forks + AI. Listen on Website → Links Web Awesome Layout Anatomy Balatro Pokémon GO A Little Arm Chair Businessin’ about Chrome – Chris Coyier Raycast Focus works really well - daverupert.com Cursor - The AI Code Editor Trae - Ship Faster with Trae Codium is now Qodo | Quality-first AI Coding Platform Windsurf Editor by Codeium Zed - The editor for what's next Ghostty Helix Sponsors Complete CSS Get to a level in development that you never thought would be possible with this expansive CSS course from Andy Bell. You won't be the same developer after completing it.…
 
Show Description Dealing with AI creating fake work by famous artists, HTML is actually a programming language, Chrome 133 updates, attr updates, making "this" less annoying, and Scott Jehl's trying to standardize Async CSS. Listen on Website → Links This Aged Great! Faking William Morris, Generative Forgery, and the Erosion of Art History HTML Programming Language HTML Semantics Consensus CSS attr() Upgrade Making this less annoying Powerful Apps for Mac & iOS Let's Standardize Async CSS! Off The Main Thread Sponsors…
 
Loading …

Welcome to Player FM!

Player FM is scanning the web for high-quality podcasts for you to enjoy right now. It's the best podcast app and works on Android, iPhone, and the web. Signup to sync subscriptions across devices.

 

Listen to this show while you explore
Play