Design Systems in Figma
Master design systems in Figma — the practical, complete guide for designers, engineers, and product teams who want to ship consistent, scalable interfaces without rebuilding the wheel every sprint.
In Design Systems in Figma, veteran design systems practitioner Ethan Mercer walks you through every layer of a modern design system — from the foundations (color, typography, spacing, iconography) through Figma components, variants, Auto Layout, variables, and design tokens, all the way to multi-brand systems, AI-assisted workflows, and the governance practices that keep systems alive for years.
Whether you're a product designer asked to “build us a design system” with no idea where to start, a senior designer scaling an existing system across multiple products, or an engineer who needs to understand what a healthy design system looks like — this book gives you the working knowledge to do the job well.
What you'll learn
• The seven layers of a complete design system — foundations, tokens, components, patterns, templates, documentation, governance
• How to build Figma components with the right anatomy: tokens, variants, properties, states, documentation
• Auto Layout for responsive components that adapt without per-context variants
• Variables and design tokens that let one library support light, dark, and multi-brand themes
• Forms, navigation, modals, data tables, dashboards, and other complex components built right
• How to audit an existing product and turn findings into a prioritized system backlog
• Developer handoff, Dev Mode, code collaboration, and the token pipeline that keeps design and code in sync
• Documentation, contribution processes, governance models, and change management
• Atomic Design, multi-brand systems, AI-assisted workflows, and the future of the field
• Three illustrative case studies showing real systems built from scratch
Who this book is for
Product designers, UI/UX designers, design system designers, front-end engineers, design leads, product managers, and anyone responsible for shipping consistent digital products at scale. No prior design systems experience required — the book builds the foundations before moving into advanced territory, so it works for both newcomers and experienced practitioners looking to deepen their practice.
What makes this book different
This isn't a Figma interface tutorial. It's the working reference you'll return to for years — written by a practitioner who has built and scaled systems across SaaS, mobile, and enterprise contexts. Every chapter follows the same structure: learning objectives, core concepts, detailed explanation, frameworks, step-by-step processes, real-world examples, best practices, common mistakes, expert tips, summary, key takeaways, review questions, and practical exercises.
If you want to stop redesigning the same button five times and start shipping interfaces that scale, Design Systems in Figma is the book you've been waiting for.