Embark on a detailed journey into design tokens with our comprehensive course. Discover everything from foundational concepts to advanced code applications, processes, best practices, and beyond.
Meet Your Instructors
Learn from the experts, Brad Frost, the creator of the Atomic Design methodology, and Ian Frost. Both are acknowledged leaders in design systems and will guide you in establishing a robust design token system tailored for scaling design and development in your organization.
What the Course Offers
More than 10 hours of in-depth video content
Architecture examples in Figma and code
Effective work processes for naming and management
Comprehensive PDF resources and practical examples
The Challenge of Uniformity and Flexibility
"Design systems make everything the same," a common challenge in organizations supporting diverse products, platforms, brands, and modes. The solution lies in design tokens.
We've assisted numerous organizations, including several Fortune 500 companies, in creating design token systems that balance consistency and individuality. This course compiles all our expertise to help you build a robust, scalable token system without repeating our past mistakes.
Course Structure: An 8-Chapter Journey
1. Basics of Design Tokens
Understand why design tokens are essential, their usage, structure, and role in modern design systems and tools.
2. Token Architecture
Dive into a three-level token system, covering color, typography, spacing, borders, animations, and more.
3. Naming and Structures
Learn naming principles, structuring recommendations, and ensure synchronization between design and code.
4. Building a Token System
Explore variables in Figma, Style Dictionary, automation, and synchronization processes to build effective token systems.
5. Publishing Tokens
Discover strategies for distributing tokens via Figma libraries, npm packages, and internal release protocols.
6. Adapting Tokens in Practice
Gain insights into how designers and developers apply tokens in real-world scenarios for maximum effect.
7. Support and Development
Manage your token system's evolution through branching, versioning, and systematic expansions.
8. Advanced Topics
Explore complex themes such as dark mode, white-label solutions, multi-product/platform strategies, and future trends involving AI.
Additional Resources
The course is enriched with architectural templates in Figma and code, FigJam process diagrams, and comprehensive slides offering a wealth of additional materials.
Hello, I’m Brad Frost. I work as a design systems consultant and frontend developer. I also teach, speak, write, and create music and art. I care about the web, creativity, and how people work together to build useful digital products.
Work in Design Systems
I have helped many teams build design systems. I focus on clear structure, open processes, and a team-first culture. I created the Atomic Design method and wrote a book about building and keeping strong design systems.
My work includes the Style podcast, Pattern Lab, Styleguides.io, and the Style Guide Guide.
Teaching and Sharing
I like to make things and share what I learn. My talks, workshops, trainings, and writing help designers and developers understand how to work with design systems.
Life and Interests
I live in Pittsburgh, Pennsylvania, with my wife, my daughter Ella, and our French bulldog, Butzi. When I take a break from design tokens, I make music or work on a new project. I look for chances to create something new.
Hello, my name is Ian Frost. I am Brad's younger brother. I work as a frontend architect, tech lead, and consultant. I focus on helping developers grow and improve their craft.
Work in Design Systems
I have worked on design systems with Brad since 2015. During these years, I built systems with Web Components, React, Angular, Vue, and other tools.
I have teamed up with tech leads, developers, and designers from many groups. I help them create and maintain clear and strong architectures for design systems and tokens. This work mixes science and art, and I want to share what we learned so you can use it in your own projects.
Background and Interests
Before I wrote code, I worked as a professional meteorologist. When I am not coding or forecasting snow, you may find me playing music, on a sports field, or with my wife and son.
Watch Online 359 lessons
This is a demo lesson (10:00 remaining)
You can watch up to 10 minutes for free. Subscribe to unlock all 359 lessons in this course and access 10,000+ hours of premium content across all courses.