Implementing Multi-Brand Theming With Style Dictionary (stu) | | 76 |
theming, branding, tooling |
Mastering Typography in Design Systems With Semantic Tokens and Responsive Scaling (uxd) | | 75 |
typography, design-systems, semantics, responsive-design, scaling |
Composite vs. Simple Tokens | | 74 |
comparisons, terminology, maintainability |
Avoiding Tokens (don) | | 73 |
design-systems |
Structuring Design Tokens for Interactive States | | 72 |
|
Definition Layers Within Semantic Tokens (ikn) | | 71 |
semantics |
Interoperable Tokens (don) | | 70 |
design-systems, sass, jsx |
Building Design Consistency: A Deep Dive Into Figma Variables at JW Player | | 69 |
deep-dives, design, design-systems, consistency, figma, variables, case-studies |
Beyond JSON: Exploring File Formats for Design Tokens (stu) | | 68 |
json, yaml, comparisons |
The Semantic Interface Palette Is Simple (uxd) | | 67 |
design, semantics, figma |
Design Tokens: Authoring vs. Consuming | | 66 |
design-systems, naming, comparisons |
The Ultimate Design Token Setup (luk/uxd) | | 65 |
design-systems, best-practices, link-lists |
Fluid Typography in Design Systems: From Design to Code (fel/uxd) | | 64 |
typography, design, design-systems |
Design Tokens Demystified (uxd) | | 63 |
components, design-systems |
Best Practices for Naming Design Tokens, Components, Variables, and More (sma) | | 62 |
naming, components, variables, best-practices |
State of Design Tokens 2024 (don+) | | 61 |
videos, figma, tooling |
The Art of Design System Recipes (bra) | | 60 |
design-systems |
When “Semantic Tokens” Are No Longer Semantic | | 59 |
semantics |
Creating a Color Ramp Using Color Modifiers in Tokens Studio (uxd) | | 58 |
design-systems, colors, figma |
Are We Too Pedantic With Semantic | | 57 |
design, semantics |
Naming Design Tokens: The Art of Clarity and Consistency (uxd) | | 56 |
naming, consistency |
Decoding Compound Tokens | | 55 |
terminology |
Truly Semantic (don) | | 54 |
semantics, naming |
Synchronizing Figma Variables With Design Tokens | | 53 |
figma, variables, automation |
The Design System Ecosystem (bra) | | 52 |
design-systems |
The Real Value of Tokens (uxd) | | 51 |
design |
Implementing Design Tokens: Colors | | 50 |
colors |
The Future of Design Systems Is Semantic (fig) | | 49 |
design-systems, processes |
How I Structured My Design System Using Figma’s New Variables (uxd) | | 48 |
design-systems, figma, variables |
Getting Started With Native Design Tokens in Figma (luk/uxd) | | 47 |
figma, introductions |
Using BEM for Design System Tokens | | 46 |
css, bem, conventions |
Creating a Flexible Design Token Taxonomy for Intuit’s Design System | | 45 |
design-systems |
Making Your Design Tokens Future-Proof (and) | | 44 |
|
Standardising Design Tokens (oll) | | 43 |
conventions |
Tokens Are the Most Valuable Artifact a Design System Can Provide | | 42 |
design-systems |
The Context Dilemma | | 41 |
design-systems |
Presentational Colors (luk/uxd) | | 40 |
colors |
Token Operations (don) | | 39 |
|
Design Tokens: Beginner’s Guide | | 38 |
guides, design-systems |
How to Manage Design Tokens | | 37 |
how-tos, maintenance |
How to Name Design Tokens in a Design System (uxd) | | 36 |
how-tos, design-systems, naming |
Unlocking the Power of Design Tokens to Create Dark Mode UI | | 35 |
dark-mode |
Versioning Design Tokens | | 34 |
versioning, maintainability |
D̶e̶s̶i̶g̶n̶ Token Clusters (uxd) | | 33 |
|
Creating Tokens for Your Design System With ChatGPT Assistance (uxd) | | 32 |
design-systems, ai, chatgpt |
Understanding Design Tokens, From UX Tool to Production | | 31 |
videos |
The Future of Design Tokens (jin+) | | 30 |
videos, outlooks |
W3C Design Tokens With Style Dictionary (luk) | | 29 |
tooling |
Design Spacing Tokens Semantically (don) | | 28 |
websites, spacing, design |
An Introduction to the Design Tokens File Format (fig) | | 27 |
videos, introductions |
The Superpowers of Design Tokens | | 26 |
videos |
Component-Level Design Tokens: Are They Worth It? | | 25 |
components |
CSS-Only Type Grinding: Casting Tokens Into Useful Values | | 24 |
css |
Design Tokens 101 | | 23 |
|
A Beginner’s Guide to Design Tokens (uxd) | | 22 |
guides |
What Are Design Tokens? | | 21 |
|
Dark Mode With Design Tokens (luk/uxd) | | 20 |
dark-mode |
Tokens as Intents (don) | | 19 |
naming, typography |
Supercharge Your Design System With Design Tokens (uxd) | | 18 |
design-systems |
Typography in Design Tokens for Figma and Code | | 17 |
typography, tooling, figma |
Component Tokens and Themes Example (to Learn Figma Tokens) (fig) | | 16 |
design, theming, components, figma |
The Case for Adding Validation State to Your Design Tokens (eri) | | 15 |
validation |
Naming Design Tokens (luk/uxd) | | 14 |
naming |
Design System Best Practices With ESLint Series (and) | | 13 |
design-systems, best-practices, tooling, eslint |
Design Systems at Replit: Better Tokens | | 12 |
case-studies, design-systems |
Design Tokens Automation Pipeline: From Design Tools to Component Libraries | | 11 |
automation, design-systems |
Becoming a Design Tokens Ambassador | | 10 |
|
Tip: Don’t Preprocess What You Can Design Token (tyl/clo) | | 9 |
css, preprocessors |
Keeping It Consistent: Design Tokens (uxd) | | 8 |
design-systems, consistency |
Component-Specific Design Tokens (clo) | | 7 |
components |
Using Design Tokens to Accelerate Design Systems | | 6 |
design-systems, css |
Easily Use Design Tokens in Eleventy (hey) | | 5 |
eleventy |
Design Token Validator (and) | | 4 |
tools, exploration, optimization, conformance |
Design Tokens Generator (Evgeny Khoroshilov) | | 3 |
tools, exploration, code-generation, css |
Design and Design Token Generator | | 2 |
tools, exploration, code-generation |
Design Tokens Generator (Leniolabs_) | | 1 |
tools, exploration, code-generation, colors, css |