Design tokens - All tokens - Components - Atlassian Design System
Design tokens are the single source of truth to name and store design decisions.
Design Tokens
How to name tokens in a Design System
The shapes of naming taxonomies for scale.
Figma Token Engine: Quick Start
Practical guide to configure and use the FTE
Designing a colour system
This article is my take on multi-brand colour systems that support light and dark modes with minimum effort. It is all about organizing…
How I name Design Tokens and Components
A brief, but hopefully effective, walk through my process of creating names for my components and all three levels of Design Tokens.
Creating a design system token taxonomy.
Geri Reid, UI and UX Designer, London
Complementary Space
Design spacing tokens semantically
Color - Reshaped
Color tokens help communicate the hierarchy of the content, its meaning, and brand presence.
Buttons
Design Tokens Generator
Quickly create Design System tokens and get JSON, CSS and SASS code. Use our Design Tokens generator to quickstart your next project!
The Future of Design Tokens - James Nash - Into Design Systems
#DesignTokens #DesignSystems
👋🏻 Missed the conference?
22 unique Design System 🎬 Recordings now on sale: https://www.intodesignsystems.com
Editor | JSON Crack
Simple visualization tool for your JSON data. No forced structure, paste your JSON and view it instantly.
Token CSS
Your new favorite way to write CSS ✨
Piping Design Tokens from Figma
Managing design tokens in Figma and synchronizing with a Git repository
Dark mode with design tokens
How to implement dark mode with as little effort as possible
How to apply design tokens to your icons
A guide for design teams to combine design tokens and icons, and make handoff a breeze with Figma Tokens and Font Awesome
Tailwind CSS - Rapidly build modern websites without ever leaving your HTML.
Documentation for the Tailwind CSS framework.
Chakra UI - A simple, modular and accessible component library that gives you the building blocks you need to build your React applications.
Simple, Modular and Accessible UI Components for your React Applications. Built with Styled System
Design Tokens on Asana's Design Systems Team - Jina Anne, Ainsley Wagoner, Ivy Wang (Schema 2021)
This talk is about how the Asana Design Systems team uses design tokens to get designers and engineers working at the same level of abstraction. Jina Anne (P...
Design tokens - Spectrum
Spectrum provides interface components, resources, and tools to help teams work more efficiently and to make applications more consistent.
Naming Tokens in Design Systems
Figma Community file — This Moodboard compiles all the examples of tokens that Nathan Curtis mentions in his article: “Naming Tokens in Design Systems” https://medium.com/eightshapes-llc/naming-tokens-in-design-systems-9e86c7444676
“Design Tokens Resources,” an article from SuperFriendly
Beginner-level guidance on design tokens.
Naming Tokens in Design Systems. Terms, Types, and Taxonomy to Describe… | by Nathan Curtis | EightShapes | Medium
Terms, Types, and Taxonomy to Describe Visual Style
Naming-Tokens-in-Design-Systems.png 5.356×3.475 Pixel
Atomic 2.0
Revisiting the Atomic Design Method for Design Systems
Naming design tokens
Learn how to effectively name your design tokens in a systematic and future proof way. Understand all key concepts used today.
Theme Builder | Components AI
Parametric and generative design tools
Becoming a design tokens ambassador
Let's see why a design tokens pipeline is an improvement that interests the developers, designers, and business stakeholders.
How design tokens empower multi-brand design systems - Louis Chenais 🟢 Live at Into Design Systems
How design tokens empower multi-brand design systems - Louis Chenais 🟢 Live at Into Design Systems 🔥Specify: https://specifyapp.com/?ref=ids2⚡️Next Design ...