DS Schema
Open reference · 2026
A estrutura completa de um Design System
Domínios · Tokens · Componentes
Abrir o explorador →
Schema
39 entidades · 8 domínios
Component tree
39 componentes · 131 dependências
Fontes
Gallery · Open UI · DSDS · DESIGN.md

SCHEMA

◈Brand4 entidades◉Language7 entidades⬡Tokens5 entidades⊞Components4 entidades⊟Patterns5 entidades✦Content4 entidades⚙Tooling5 entidades⚑Govern.5 entidades

Um design system não é uma lista de componentes. É um grafo de domínios interdependentes — da personalidade da marca aos tokens, dos tokens aos componentes, dos componentes aos padrões. Este é o mapa completo.

Explorar o schemaOu ir direto à árvore de componentes
01 — Os domínios

Oito domínios,
uma estrutura.

Cada domínio alimenta o próximo. Marca define linguagem, linguagem vira tokens, tokens alimentam componentes — e tudo é documentado, entregue e governado.

◈01
Brand & Principles
4 entidades
MissionBrandDesign+1
◉02
Design Language
7 entidades
ColorTypographySpacing+4
⬡03
Design Tokens
5 entidades
PrimitiveSemanticComponent+2
⊞04
Components
4 entidades
AtomsMoleculesOrganisms+1
⊟05
Patterns & Templates
5 entidades
FormNavigationFeedback+2
✦06
Content & Voice
4 entidades
UXTerminologyInternationalization+1
⚙07
Tooling & Delivery
5 entidades
FigmaStorybookPackage+2
⚑08
Governance & Process
5 entidades
DSContributionVersioning+2
02 — A árvore de componentes

Cada componente
é um nó.

Button precisa de Icon. ButtonGroup precisa de Button. DataTable precisa de tudo. 39 componentes em quatro níveis do Atomic Design, com anatomia, aliases cross-system, tokens por parte e o impacto em cascata de cada mudança.

16
átomos
39
componentes
131
arestas
Ver a árvore completa
DataTableorganism
11
Modalorganism
6
Selectmolecule
3
Buttonatom
4
Iconatom
0
03 — Fundamentado em pesquisa

Cruzando as referências mais sérias da indústria.

Component Gallery↗

60 componentes, 95 design systems, 2.671 exemplos catalogados.

Open UI↗

Pesquisa cross-system de anatomia, nomes e API. Alimenta o W3C.

DSDS 0.11↗

Spec machine-readable de documentação de design systems.

DESIGN.md↗

Formato do Google Labs para descrever DS a agentes de código.

Base UI & Base Web↗

Referências headless (MUI) e enterprise (Uber).

NN/G + DS Checklist↗

Fundamentos de estrutura, governança e processo.

Comece a explorar.

Abrir o explorador completo