A design system is a unified, documented library of reusable UI components, design tokens, and patterns that ensures visual and behavioral consistency across a product. Components include buttons, inputs, modals, and cards; tokens cover color, typography, and spacing values; patterns include interaction conventions and accessibility standards. It is typically delivered as both a Figma component library for designers and a code package (React, Vue, Web Components) for engineers. It is the infrastructure layer underneath product UI work and the difference between a company that ships a consistent product across surfaces and one that ships a fragmented patchwork.
The major public design systems set the modern standard: Material D...