Keith Daulton
@keithdaulton.com
Tech lead of @gitlens.bsky.social. Dad, hubby, musician, designer, explorer of whisk(e)y.
🖤 front end, web components, design systems, open-source
🖤 front end, web components, design systems, open-source
Pinned
Keith Daulton
@keithdaulton.com
· Jun 13
Web Component AI Tools - Visual Studio Marketplace
Extension for Visual Studio Code - Supercharge your AI coding assistants with web component information from your workspace and dependencies. Generate accurate component code using your actual custom ...
marketplace.visualstudio.com
I started a little pet project recently, a VS Code extension that discovers Custom Elements Manifests in your workspace and starts a local MCP server that AI assistants can connect to. Features are still very early & rough.
Love to hear your feedback!
marketplace.visualstudio.com/items?itemNa...
Love to hear your feedback!
marketplace.visualstudio.com/items?itemNa...
Reposted by Keith Daulton
Lit is joining @openjsf.org! 🎉
Today at JSConf, The OpenJS Foundation announced Lit is officially joining as an Impact Project!
We're beyond excited for this move and look forward to continuing our work to build the open web with OpenJS!
Read more on our blog: lit.dev/blog/2025-10...
Today at JSConf, The OpenJS Foundation announced Lit is officially joining as an Impact Project!
We're beyond excited for this move and look forward to continuing our work to build the open web with OpenJS!
Read more on our blog: lit.dev/blog/2025-10...
Lit is Joining the OpenJS Foundation!
Lit is officially joining the OpenJS Foundation as an Impact Project!
lit.dev
October 14, 2025 at 1:35 PM
Lit is joining @openjsf.org! 🎉
Today at JSConf, The OpenJS Foundation announced Lit is officially joining as an Impact Project!
We're beyond excited for this move and look forward to continuing our work to build the open web with OpenJS!
Read more on our blog: lit.dev/blog/2025-10...
Today at JSConf, The OpenJS Foundation announced Lit is officially joining as an Impact Project!
We're beyond excited for this move and look forward to continuing our work to build the open web with OpenJS!
Read more on our blog: lit.dev/blog/2025-10...
Reposted by Keith Daulton
All of the colors are calculated based on a single CSS variable using relative oklch, so you can change the theme with just one line.
--tint: green;
Modern CSS is amazing! 😲
--tint: green;
Modern CSS is amazing! 😲
October 14, 2025 at 10:49 PM
All of the colors are calculated based on a single CSS variable using relative oklch, so you can change the theme with just one line.
--tint: green;
Modern CSS is amazing! 😲
--tint: green;
Modern CSS is amazing! 😲
Reposted by Keith Daulton
super excited for @lit.dev to be joining the OpenJS foundation!
Kudos to:
@justinfagnani.com
Steve Orvell
@graynorton.bsky.social
Kevin Schaaf
Peter Burns
and any others from the Lit team and community that helped pull it off!
Huge and great news for Lit!
lit.dev/blog/2025-10...
Kudos to:
@justinfagnani.com
Steve Orvell
@graynorton.bsky.social
Kevin Schaaf
Peter Burns
and any others from the Lit team and community that helped pull it off!
Huge and great news for Lit!
lit.dev/blog/2025-10...
Lit is Joining the OpenJS Foundation!
Lit is officially joining the OpenJS Foundation as an Impact Project!
lit.dev
October 15, 2025 at 2:40 PM
super excited for @lit.dev to be joining the OpenJS foundation!
Kudos to:
@justinfagnani.com
Steve Orvell
@graynorton.bsky.social
Kevin Schaaf
Peter Burns
and any others from the Lit team and community that helped pull it off!
Huge and great news for Lit!
lit.dev/blog/2025-10...
Kudos to:
@justinfagnani.com
Steve Orvell
@graynorton.bsky.social
Kevin Schaaf
Peter Burns
and any others from the Lit team and community that helped pull it off!
Huge and great news for Lit!
lit.dev/blog/2025-10...
Made my first hot sauce! Now it needs a name…
October 3, 2025 at 4:32 AM
Made my first hot sauce! Now it needs a name…
Started a new hobby about a month ago, brewing ciders and mead!
You be seeing more of this in addition to other foodie stuff I get myself into. I’ve been trying to find more for-fun activities that don’t rely on my laptop.
You be seeing more of this in addition to other foodie stuff I get myself into. I’ve been trying to find more for-fun activities that don’t rely on my laptop.
October 3, 2025 at 4:23 AM
Started a new hobby about a month ago, brewing ciders and mead!
You be seeing more of this in addition to other foodie stuff I get myself into. I’ve been trying to find more for-fun activities that don’t rely on my laptop.
You be seeing more of this in addition to other foodie stuff I get myself into. I’ve been trying to find more for-fun activities that don’t rely on my laptop.
Reposted by Keith Daulton
What's coming in CSS? Mixins, Functions, Progress, and more… www.youtube.com/watch?v=ER4A...
What's coming in CSS? Mixins, Functions, Progress, and more…
YouTube video by Winging It
www.youtube.com
August 27, 2025 at 6:00 PM
What's coming in CSS? Mixins, Functions, Progress, and more… www.youtube.com/watch?v=ER4A...
Reposted by Keith Daulton
I am very excited to announce the alpha release of the #WebComponents Language Server!!!
August 14, 2025 at 2:51 PM
I am very excited to announce the alpha release of the #WebComponents Language Server!!!
Reposted by Keith Daulton
Reposted by Keith Daulton
I'll say it again: Every framework should be going all-in on first-class web components support.
With React eating the world, second-tier frameworks are often left behind. Web components are the scalable way for these projects to support multiple frameworks, and we should all encourage it.
With React eating the world, second-tier frameworks are often left behind. Web components are the scalable way for these projects to support multiple frameworks, and we should all encourage it.
July 25, 2025 at 6:37 PM
I'll say it again: Every framework should be going all-in on first-class web components support.
With React eating the world, second-tier frameworks are often left behind. Web components are the scalable way for these projects to support multiple frameworks, and we should all encourage it.
With React eating the world, second-tier frameworks are often left behind. Web components are the scalable way for these projects to support multiple frameworks, and we should all encourage it.
Reposted by Keith Daulton
“The reason SPAs became the default wasn’t because they were better. It was because, for a while, they were the only way to deliver something that felt fluid – something that didn’t flash white between pages or jank the scroll position.”
www.jonoalderson.com/conjecture/i...
www.jonoalderson.com/conjecture/i...
It's time for modern CSS to kill the SPA
Native CSS transitions have quietly killed the strongest argument for client-side routing. Yet people keep building terrible apps instead of performant websites.
www.jonoalderson.com
July 26, 2025 at 1:13 AM
“The reason SPAs became the default wasn’t because they were better. It was because, for a while, they were the only way to deliver something that felt fluid – something that didn’t flash white between pages or jank the scroll position.”
www.jonoalderson.com/conjecture/i...
www.jonoalderson.com/conjecture/i...
Reposted by Keith Daulton
Can you Syntax Highlight a code snippet on the web without overloading the DOM with a ton of elements wrapped around the tokens? | www.bram.us/2024/02/18/c...
Syntax Highlighting code snippets with Prism and the Custom Highlight API
Can you Syntax Highlight a code snippet on the web without overloading the DOM with a ton of <span> elements wrapped around the tokens? Thanks to the Custom Highlight API, you can!
www.bram.us
July 19, 2025 at 2:21 PM
Can you Syntax Highlight a code snippet on the web without overloading the DOM with a ton of elements wrapped around the tokens? | www.bram.us/2024/02/18/c...
Dear IDEs and AI tools,
Can you all settle in on one path to mcp.json, so we don’t have to take the same damn config file and copy/paste for each one of you!?
Can you all settle in on one path to mcp.json, so we don’t have to take the same damn config file and copy/paste for each one of you!?
July 15, 2025 at 2:34 PM
Dear IDEs and AI tools,
Can you all settle in on one path to mcp.json, so we don’t have to take the same damn config file and copy/paste for each one of you!?
Can you all settle in on one path to mcp.json, so we don’t have to take the same damn config file and copy/paste for each one of you!?
Reposted by Keith Daulton
📢 BIG NEWS IF YOU ARE AN OPEN SOURCE MAINTAINER!
The HeroDevs Open Source Sustainability Fund is giving $20M to creators shipping secure, high-impact OSS — while we handle legacy.
Learn how to apply→ www.herodevs.com/blog-posts/h...
#OpenSource #CyberSecurity #EOL #HeroDevs
The HeroDevs Open Source Sustainability Fund is giving $20M to creators shipping secure, high-impact OSS — while we handle legacy.
Learn how to apply→ www.herodevs.com/blog-posts/h...
#OpenSource #CyberSecurity #EOL #HeroDevs
June 23, 2025 at 8:19 PM
📢 BIG NEWS IF YOU ARE AN OPEN SOURCE MAINTAINER!
The HeroDevs Open Source Sustainability Fund is giving $20M to creators shipping secure, high-impact OSS — while we handle legacy.
Learn how to apply→ www.herodevs.com/blog-posts/h...
#OpenSource #CyberSecurity #EOL #HeroDevs
The HeroDevs Open Source Sustainability Fund is giving $20M to creators shipping secure, high-impact OSS — while we handle legacy.
Learn how to apply→ www.herodevs.com/blog-posts/h...
#OpenSource #CyberSecurity #EOL #HeroDevs
Reposted by Keith Daulton
Okay gang, those who sling HTML, CSS, JS, which _Firefox_ bugs are blocking you? Which features do you think need improving? What new features would you like to see? What work would you prioritise? Big or small, bonus points for linking to a bug (even more for filing bugs then linking them)!
June 17, 2025 at 5:24 PM
Okay gang, those who sling HTML, CSS, JS, which _Firefox_ bugs are blocking you? Which features do you think need improving? What new features would you like to see? What work would you prioritise? Big or small, bonus points for linking to a bug (even more for filing bugs then linking them)!
Reposted by Keith Daulton
Hey friends, did you know you can make a modal
HTMLDialogElement: closedBy property - Web APIs | MDN
The closedBy property of the
HTMLDialogElement interface indicates the types of user actions that can be used to close the associated <dialog> element. It sets or returns the dialog's closedby attribu...
developer.mozilla.org
May 28, 2025 at 2:46 PM
Hey friends, did you know you can make a modal
I started a little pet project recently, a VS Code extension that discovers Custom Elements Manifests in your workspace and starts a local MCP server that AI assistants can connect to. Features are still very early & rough.
Love to hear your feedback!
marketplace.visualstudio.com/items?itemNa...
Love to hear your feedback!
marketplace.visualstudio.com/items?itemNa...
Web Component AI Tools - Visual Studio Marketplace
Extension for Visual Studio Code - Supercharge your AI coding assistants with web component information from your workspace and dependencies. Generate accurate component code using your actual custom ...
marketplace.visualstudio.com
June 13, 2025 at 1:51 AM
I started a little pet project recently, a VS Code extension that discovers Custom Elements Manifests in your workspace and starts a local MCP server that AI assistants can connect to. Features are still very early & rough.
Love to hear your feedback!
marketplace.visualstudio.com/items?itemNa...
Love to hear your feedback!
marketplace.visualstudio.com/items?itemNa...
Reposted by Keith Daulton
If you've never heard of a Custom Elements Manifest, they are an invaluable tool for unlocking tons of capabilities for your #WebComponents.
dev.to/stuffbreaker...
dev.to/stuffbreaker...
You Should Be Shipping a Manifest with Your Web Components
Besides your components, the Custom Elements Manifest is the most important thing you can ship in...
dev.to
June 12, 2025 at 1:06 AM
If you've never heard of a Custom Elements Manifest, they are an invaluable tool for unlocking tons of capabilities for your #WebComponents.
dev.to/stuffbreaker...
dev.to/stuffbreaker...
Reposted by Keith Daulton
Going to be talking about curiosity and it's role in design later today at evolvedrupal.com - made a few adjustments since @beyondtellerrand.com and excited to see how folks react
EvolveDrupal – Connect, Learn & Inspire with the Tech Community
Join EvolveDrupal, the premier summit for digital professionals in the U.S. and Canada. Learn from experts, attend hands-on sessions, and network with industry leaders. Register today!
www.evolvedrupal.com
June 6, 2025 at 12:34 PM
Going to be talking about curiosity and it's role in design later today at evolvedrupal.com - made a few adjustments since @beyondtellerrand.com and excited to see how folks react
Reposted by Keith Daulton
Hey friends! 🚀
I’m running the biggest sale ever on my Web Component Engineering course: 25% off through July 🎉
It’s full of hands-on, flexible training to help you build components, design systems, and apps. Use code SUMMERFUN to get it now!
(Link in the follow up.)
#webcomponents #frontenddev
I’m running the biggest sale ever on my Web Component Engineering course: 25% off through July 🎉
It’s full of hands-on, flexible training to help you build components, design systems, and apps. Use code SUMMERFUN to get it now!
(Link in the follow up.)
#webcomponents #frontenddev
June 5, 2025 at 9:32 PM
Hey friends! 🚀
I’m running the biggest sale ever on my Web Component Engineering course: 25% off through July 🎉
It’s full of hands-on, flexible training to help you build components, design systems, and apps. Use code SUMMERFUN to get it now!
(Link in the follow up.)
#webcomponents #frontenddev
I’m running the biggest sale ever on my Web Component Engineering course: 25% off through July 🎉
It’s full of hands-on, flexible training to help you build components, design systems, and apps. Use code SUMMERFUN to get it now!
(Link in the follow up.)
#webcomponents #frontenddev
@mozilla.org you teased me and only introduced Import Attributes support for JSON. Awesome as JSON support is, I mainly want CSS support 🙏 bugzilla.mozilla.org/show_bug.cgi...
May 26, 2025 at 1:45 AM
@mozilla.org you teased me and only introduced Import Attributes support for JSON. Awesome as JSON support is, I mainly want CSS support 🙏 bugzilla.mozilla.org/show_bug.cgi...
Yes! Now I can finally author plain CSS for my web components!!
It was about time, wasn't it? 😅 👇
But now, with Firefox 138 all major browser engines support import attributes to import JSON from within your ECMAScript modules. 👇
✅ Chromium: 123+
✅ Safari: 17.2+
✅ Firefox: 138+ (released 2w ago)
PS. This syntax works in modern Node.js, too!
But now, with Firefox 138 all major browser engines support import attributes to import JSON from within your ECMAScript modules. 👇
✅ Chromium: 123+
✅ Safari: 17.2+
✅ Firefox: 138+ (released 2w ago)
PS. This syntax works in modern Node.js, too!
May 18, 2025 at 7:27 PM
Yes! Now I can finally author plain CSS for my web components!!
If you see this, post your getaway vehicle
May 4, 2025 at 3:21 PM
If you see this, post your getaway vehicle
Reposted by Keith Daulton
When you file an open source issue and the maintainer asks for more information, please just give it rather than saying you already included all the info. We wouldn't ask if we had everything we needed.
April 21, 2025 at 3:53 PM
When you file an open source issue and the maintainer asks for more information, please just give it rather than saying you already included all the info. We wouldn't ask if we had everything we needed.
Its not called HYDRA in this timeline
April 11, 2025 at 2:17 AM
Its not called HYDRA in this timeline
Reposted by Keith Daulton
Quick Reminder That :is() and :where() Are Basically the Same With One Key Difference from @geoffgraham.me on @css-tricks.com
css-tricks.com/quick...
#CSS #WebDev #FrontEnd
css-tricks.com/quick...
#CSS #WebDev #FrontEnd
Quick Reminder That :is() and :where() Are Basically the Same With One Key Difference | CSS-Tricks
I've seen a handful of recent posts talking about the utility of the :is() relational pseudo-selector. No need to delve into the details other than to say it
css-tricks.com
March 21, 2025 at 4:59 PM
Quick Reminder That :is() and :where() Are Basically the Same With One Key Difference from @geoffgraham.me on @css-tricks.com
css-tricks.com/quick...
#CSS #WebDev #FrontEnd
css-tricks.com/quick...
#CSS #WebDev #FrontEnd