# Visão geral

Todos os 52 componentes do Feitio, por grupo. Cada um tem quando usar, quando não usar e o código.

Filtrar componentes

## Ações

-   [**Button**Faz uma ação na tela onde está.](/pt/components/button/)
-   [**Link**Leva a outra página, ou a outro ponto desta.](/pt/components/link/)
-   [**LinkCard**Uma porta para outra área: título, frase e a seta.](/pt/components/linkcard/)

## Texto e estrutura da página

-   [**Heading**O título de uma página ou de uma seção.](/pt/components/heading/)
-   [**Text**O texto para ler, na medida.](/pt/components/text/)
-   [**Icon**Um desenho do sprite, ao lado da palavra.](/pt/components/icon/)
-   [**Block**Um bloco de conteúdo sobre a página.](/pt/components/block/)
-   [**VisuallyHidden**Texto só para o leitor de tela.](/pt/components/visually-hidden/)
-   [**SkipLink**Pula direto para o conteúdo, pelo teclado.](/pt/components/skiplink/)
-   [**Divider**A linha fina entre duas partes que se tocam.](/pt/components/divider/)
-   [**Kbd**Uma tecla, escrita como no teclado.](/pt/components/kbd/)

## Layout

-   [**Stack**Empilha as peças, com o espaço da régua entre elas.](/pt/components/stack/)
-   [**Inline**Põe as peças lado a lado, quebrando a linha quando não cabem.](/pt/components/inline/)
-   [**Grid**Colunas que se ajustam à largura, sem passar da tela.](/pt/components/grid/)

## Formulário

-   [**Field**Rótulo, dica, controle e erro de um campo.](/pt/components/field/)
-   [**TextInput**Uma linha de texto.](/pt/components/textinput/)
-   [**TimeInput**Hora e minuto, em 12 ou 24 horas.](/pt/components/timeinput/)
-   [**Textarea**Várias linhas de texto.](/pt/components/textarea/)
-   [**Select**Uma escolha numa lista longa.](/pt/components/select/)
-   [**Checkbox**Sim ou não, ou várias escolhas.](/pt/components/checkbox/)
-   [**Radios**Uma escolha entre poucas, todas à vista.](/pt/components/radios/)
-   [**Switch**Liga e desliga um ajuste, valendo ao salvar.](/pt/components/switch/)
-   [**SegmentedControl**Uma escolha entre poucas opções vizinhas.](/pt/components/segmented/)
-   [**Fieldset**Agrupa campos que respondem uma pergunta.](/pt/components/fieldset/)
-   [**FilterField**Filtra a lista de baixo enquanto a pessoa digita.](/pt/components/filterfield/)

## Retorno e erros

-   [**ErrorMessage**O erro de um campo, embaixo dele.](/pt/components/errormessage/)
-   [**ErrorSummary**Todos os erros do formulário, no topo.](/pt/components/errorsummary/)
-   [**Notice**Um aviso com as palavras do que aconteceu.](/pt/components/notice/)
-   [**Tag**O estado de uma coisa, com ícone e palavra.](/pt/components/tag/)
-   [**EmptyState**Quando não há nada: o desenho e o próximo passo.](/pt/components/emptystate/)
-   [**StatusOverlay**O retorno no próprio container: carregando, certo, erro.](/pt/components/statusoverlay/)

## Dados

-   [**Table**Muitas coisas do mesmo tipo, para comparar.](/pt/components/table/)
-   [**SummaryList**As características de uma coisa só.](/pt/components/summarylist/)
-   [**TaskList**Coisas a fazer, cada uma com o estado.](/pt/components/tasklist/)
-   [**Pagination**Divide uma lista longa em páginas.](/pt/components/pagination/)

## Navegação

-   [**Header**O cabeçalho do site: marca, áreas e ferramentas.](/pt/components/header/)
-   [**Footer**O rodapé: a marca, os anos e os links.](/pt/components/footer/)
-   [**AppShell**O layout de regiões de um produto.](/pt/components/appshell/)
-   [**Nav**Os lugares do produto, com o atual marcado.](/pt/components/nav/)
-   [**Breadcrumbs**O caminho do início até aqui.](/pt/components/breadcrumbs/)
-   [**Anchor**O índice da página, que acompanha a rolagem.](/pt/components/anchor/)
-   [**Details**Um trecho fechado que a pessoa abre se quiser.](/pt/components/details/)
-   [**ScrollFade**Avisa que há mais conteúdo embaixo.](/pt/components/scrollfade/)
-   [**BackToTop**Volta ao começo depois de meia tela.](/pt/components/backtotop/)
-   [**Search**Busca no produto, com resultados enquanto digita.](/pt/components/search/)

## Por cima da tela

-   [**Dialog**Uma pergunta antes de uma ação grande.](/pt/components/dialog/)
-   [**Drawer**Um painel que entra por uma borda.](/pt/components/drawer/)

## Documentação

-   [**CodeBlock**Código com cores e o botão Copiar.](/pt/components/codeblock/)
-   [**Example**O exemplo ao vivo, com o código dele.](/pt/components/example/)
-   [**DoDont**O jeito certo e o errado, lado a lado.](/pt/components/dodont/)
-   [**Swatch**A amostra de uma cor, ao lado do nome.](/pt/components/swatch/)

## Modelos de página

-   [**DocPage**A página de documentação inteira, com as regiões.](/pt/components/docpage/)

Nenhum componente com esse nome.