---
conceito: composicao
termo: "composicao"
secao_dona: seed-composicao#01
declarado_por: 18 seção(ões)
gerado_por: 06-validacao/geradores/gen-camada-ia.py
nota: página GERADA de `01-canonicos/seed-consulta.json` — não editar à mão; os conceitos se declaram na seção, e os links saem daí
---

# composicao

A montagem da tela: canvas, peças que flutuam sobre ele, calha e separação.

**Seção dona (é ela que manda neste conceito):** `seed-composicao#01`

## Onde este conceito é declarado (18)

- [seed-componentes §26 — Card](https://ds.seed.eng.br/10-publicacao/ia/seed-componentes/26-card-estavel-v0-26-cd1-cd5-validacao-executada.md) — Card: quando é cartão, superfície, elevação, área clicável, densidade — CD1–CD5.
- [seed-componentes §57 — Quadro / Kanban](https://ds.seed.eng.br/10-publicacao/ia/seed-componentes/57-quadro-kanban-estavel-f7-4-2026-08-16-qd1-qd14.md) — Quadro/Kanban: colunas como trilha, cartão como peça, arrastar, limites de coluna — QD1–QD14 (gabarito A7).
- [seed-componentes §72 — SH1 — COLISÃO, COBERTURA, CORTE e VAZAMENTO](https://ds.seed.eng.br/10-publicacao/ia/seed-componentes/72-sh1-colisao-cobertura-corte-e-vazamento-regra.md) — SH1: colisão, cobertura, corte e vazamento — nada se sobrepõe nem transborda.
- [seed-composicao cabeçalho — cabeçalho (H1 e notas de abertura)](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/_cabecalho.md) — As regras de MONTAGEM de tela: canvas, peças, calha, colapso — versão e estado.
- [seed-composicao §00 — Para quem nunca viu este projeto](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/00-para-quem-nunca-viu-este-projeto.md) — Para quem chega agora: o que é composição e onde ela para (componentes e tokens).
- [seed-composicao §01 — A lei de origem — CP1 (o SH16 vira lei](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/01-a-lei-de-origem-cp1-o-sh16-vira-lei-executa-o.md) — CP1: a tela é um canvas com peças sobre ele (raio, par sombra+anel, calha sp-3).
- [seed-composicao §02 — Vocabulário mínimo de blocos — CP2](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/02-vocabulario-minimo-de-blocos-cp2.md) — CP2: os sete tipos de bloco de toda tela; classifique o elemento antes de estilizá-lo.
- [seed-composicao §03 — Contrato de montagem por arquétipo — CP3 a CP12](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/03-contrato-de-montagem-por-arquetipo-cp3-a-cp12.md) — CP3–CP12: o contrato de montagem por ARQUÉTIPO, 23 gabaritos — canvas, peça, raio, calha.
- [seed-composicao §04 — Como um template se declara — CP13 e CP14](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/04-como-um-template-se-declara-cp13-e-cp14.md) — CP13–CP14 — como um template se declara: gramática, slots, o que a instância pode mudar.
- [seed-composicao §05 — Densidade e ordem de colapso — CP15 e CP16](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/05-densidade-e-ordem-de-colapso-cp15-e-cp16.md) — CP15–CP16 — densidade e a ordem canônica de colapso da tela até 360 px.
- [seed-composicao §06 — Apresentabilidade como regra de composição — CP17 a CP21](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/06-apresentabilidade-como-regra-de-composicao-cp17.md) — CP17–CP21 — apresentabilidade como regra: sombra+anel, o que dá vida visual sem cor isolada.
- [seed-composicao §07 — Cor em composição — CP22 a CP24](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/07-cor-em-composicao-cp22-a-cp24-decisoes-de-marca.md) — CP22–CP24: cor em composição — cor de entidade, gradiente de chrome, marcador de agora.
- [seed-composicao §07b — Primitivos de layout — CP25](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/07b-primitivos-de-layout-cp25-camada-nova-f5-2026.md) — CP25: os cinco primitivos de layout (pilha, cluster, lateral, grade, centro); todo espaçamento vem deles.
- [seed-composicao §07c — Responsivo em DUAS camadas — CP26, CP27 e CP28](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/07c-responsivo-em-duas-camadas-cp26-cp27-e-cp28-f7.md) — CP26–CP28 — responsivo em duas camadas: gabarito, container query nomeada (app/tela/pagina/conteudo…), viewport e reflow.
- [seed-composicao §07d — Relações de composição e arraste — CP29 e CP30](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/07d-relacoes-de-composicao-e-arraste-cp29-e-cp30-f4.md) — CP29–CP30: relações entre blocos e arraste — o que acontece ENTRE duas peças.
- [seed-composicao §07e — Escala de figura — CP32](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/07e-escala-de-figura-cp32-f7-3-2026-08-16-a-lei-que.md) — CP32 — escala de figura: densidade de dado não depende da largura da tela.
- [seed-composicao §08 — Supersedes formais — emitidos e recebidos por este arquivo](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/08-supersedes-formais-emitidos-e-recebidos-por.md) — Supersedes formais deste arquivo: o que ele superou e o que o superou.
- [seed-composicao §10 — O que esta fase NÃO cobre](https://ds.seed.eng.br/10-publicacao/ia/seed-composicao/10-o-que-esta-fase-nao-cobre.md) — O que este arquivo NÃO cobre — as fronteiras com componentes, dataviz e telas.
