#Development #Tools
CSS Design Tokens Analyzer · Uncover design tokens from your stylesheet https://ilo.im/1652ji
_____
#DesignTokens #DesignSystems #Webpage #Design #WebDesign #WebDev #Frontend #CSS
Created some tests for web components that retrieve a required design token value and check if the rendered elements have the equivalent computed value. For example, if the element is showing the correct values for a focus ring.
design like it's 1997. code like it's 2025. 
Figma Variables and Design Tokens—Variable Architecture, by @lurkmoophy (@zeroheight):
https://zeroheight.com/blog/figma-variables-and-design-tokens-part-one-variable-architecture/
github.com/bennypowers/cem/releases/tag/v0.1.0
bennypowers.github.io/cem
New CLI tool to generate #CustomElements manifests. It's 10x faster than the competition and can automatically document your parts and slots for you, as well as look up #designTokens in your #css files.
Give it a try, 
the repo, file an issue, let me know what you think.
Practical UI Design with tokens | Penpot Hands-On Demo
https://peertube.kaleidos.net/videos/watch/9a714b33-2bd4-4a95-8930-2646ab6343c0
This Week in Design Systems News!
Explore articles on design tokens, localisation, planning, and content. Check out resources from Penpot and Circle UI
Stay up–to–date: https://news.design.systems
#DesignSystems #FrontEnd #WebDesign #DesignOps #DesignTokens
I've almost got an issue of the Design Systems Newsletter without a single link to medium. Almost.
If you want a weekly slice of the best curated Design Systems resources - be sure to sign up - https://news.design.systems
#DesignSystems #DesignTokens #FrontEnd #WebDesign #WebDev
Had to tackle a couple of niche, tricky things for our #DesignSystem at work recently. Would like to blog about them and the solutions we found.
Help me prioritise. Which one(s) would you be most interested in?
Need help with your design system? Struggling with design tokens? Looking for a front-end developer?
Let’s tackle it together!
www.alwaystwisted.com
#Design #Launches
Design Tokens Name Generator · Design token naming conventions for your design system https://ilo.im/163l9d
_____
#Generator #Naming #DesignTokens #DesignSystems #Development #WebDev #Frontend
Need a quick start to creating some design tokens with a ready-made naming convention?
Romina has made this pretty neat tool:
https://namedesigntokens.guide
Check out Design Tokens Language Server, a tool to supercharge your DX with design tokens. Learn how it brings autocomplete, validation, and more to your favorite editor. Check it out! 
bennypowers.dev/posts/introducing-design-tokens-language-server/ #DesignTokens #WebDev #css #neovim #vscode #zededitor
Where do design tokens actually come from and why they matter in modern #webdevelopment 
During our last #Frontend and Friends meetup, Nils Wiere, Freelance Design System Consultant) walked the audience through the evolution of #designtokens - Watch the recording on our YouTube channel to see the full session: https://youtu.be/uMb4M7VCRCE?si=5tqcd94i0Dx2Aq7K
London pals! Come hang out with me and cool Penpot folks in SE1 on the 13th of May.
We’ll be discussing all things design tokens and collaboration in a fab venue with lovely food and drinks.
And it’s free! Limited spots available:
https://app.hi.events/event/370/penpot-after-hours-london
(Non-Londoners also very welcome 
)
Implementing Multi-Brand Theming With Style Dictionary, by @sturobson:
https://www.alwaystwisted.com/articles/a-design-tokens-workflow-part-9
New Article Alert
After writing about @penpot.app's new Design Tokens panel I've added a new article for the Design Tokens Workflow Series:
Creating a Penpot Design Tokens Format with Style Dictionary
https://www.alwaystwisted.com/articles/a-design-tokens-workflow-part-12
