A design system is a combined system of design principles, design tokens, components, patterns and guidelines. It describes both what should be built and how the parts should relate to one another. A design system is therefore more than a visual style guide. It should support consistent design, efficient development and a shared way of making decisions.
What does a design system involve in practice?
In practice, the system consists of typography, colour use, spacing, components, interactions and documentation. It should also describe how components are used, which variants exist and what should not be combined. The system must be easy enough to use every day and flexible enough to evolve as needs change.
A design system is relevant when a website has many pages, several contributors or will be developed over time. It creates value when connected to actual content and workflows. See Components, Variables and Figma's explanation of design systems.
Let's build something solid together
We help ambitious businesses with branding, UI/UX and Webflow solutions that are thoughtful, clear and built to last.
.avif)