design system
/dɪˈzaɪn ˈsɪstəm/
CommonA shared collection of UI components, patterns, and guidelines used across a product or company.
Can mean different things at different companies. Ranges from a Figma file with colors to a fully documented component library with code. Often a source of ongoing debate about who owns it.
| # | Example | What it means | Source |
|---|---|---|---|
| 01 | use the design system button. don't make a new one | The reviewer is asking the developer to reuse an existing component instead of creating a duplicate. | x, 2023 |
| 02 | we have 14 different button styles and no design system. this is fine | The product has grown without consistency and the speaker is using sarcasm. | x, 2024 |
| 03 | six months to ship the design system. now components take a day instead of a week | The upfront investment in a design system paid off in development speed. | x, 2023 |
| 04 | is that in the design system? no. should it be? yes. is anyone working on it? no | The design system is missing coverage for a common pattern, and no one has been assigned to fix it. | reddit, 2022 |
Use it when
- Referring to the shared UI foundations of a product or company.
- Discussing consistency across different parts of a product.
- Talking about the work of building or maintaining shared components.
Do not use it when
- You mean a single component or UI pattern.Use “component” instead.
- You mean a style guide without code.
Design system vs component library
design system
A design system includes components plus the rules, patterns, principles, and documentation that govern them.
component-library
A component library is just the reusable code or Figma components, without the broader guidelines.
Origin and context
The term became widely used in tech after major companies published their own open-source design systems, including Google Material Design (2014), Apple Human Interface Guidelines, and IBM Carbon Design System. Airbnb and Shopify Polaris helped normalize the concept at mid-size companies.
- First seen
- mid-2010s
- Confidence
- medium
Cite this page
Use this stable URL to reference the entry.
https://slang.fyi/design-system