← Trail· Lesson 9 of 9

CSS accessibility

Visible focus, forms, contrast, and motion — CSS in service of everyone.

TODO i18n: Full body translation pending. Title and description are localized; the body below remains in Portuguese for now.

Um layout bonito que some o foco do teclado não está pronto.

Pratique no playground

Formulário acessível — labels, estados e foco.
:has() no pai — feedback visual sem JS.
Botão com hover — não dependa só de cor; inclua :focus-visible.

Kit de snippets

Focus ring
sr-only
Checkbox e radio custom
Underline animado com hover e focus

Leitura

Checklist no blog: Acessibilidade com CSS.

Encerramento da trilha

Você chegou ao fim de CSS do zero ao layout (9 lições). Continue explorando exemplos, snippets e o blog.