EspañolCSS reset moderno (gerador)
Marque as regras. Cada uma tem um comentário curto explicando o que corrige, então dá para entender e ajustar em vez de copiar às cegas.
O CSS que vai no começo de todo site
Disponível em: 
CSS reset moderno (gerador): para que serve
Todo projeto começa corrigindo as mesmas coisas: margens padrão, box-sizing, imagens que estouram o layout, campos de formulário com outra fonte e palavras longas que quebram a tela no celular.
Marque as regras que quer e copie um reset curto e comentado, com box-sizing border-box, altura mínima em dvh, mídia responsiva, font: inherit nos formulários, overflow-wrap, text-wrap balance e pretty nos títulos e parágrafos, rolagem suave só para quem não pediu menos movimento e o desligamento das animações para quem pediu.
Como usar
- Marque as regras que quer usar.
- Leia o comentário de cada uma.
- Copie ou baixe o reset.css e coloque no início do CSS.
Quando usar
- Começar um site do zero.
- Padronizar projetos da equipe.
- Entender o que cada regra de reset faz.
Perguntas frequentes
O que é um CSS reset?
Um conjunto pequeno de regras colocado no início do CSS para tirar diferenças e padrões incômodos dos navegadores, como margens no body, imagens que estouram o layout e campos de formulário com outra fonte. Facilita escrever o resto do CSS.
Reset ou normalize?
O normalize.css preserva os estilos padrão e só corrige as diferenças entre navegadores; um reset moderno vai um pouco além e remove o que quase sempre se sobrescreve. Os navegadores atuais estão bem mais parecidos, então resets curtos como este se tornaram os mais usados.
Por que a rolagem suave fica dentro de uma media query?
Rolagem animada pode causar enjoo em quem tem sensibilidade a movimento. Dentro de prefers-reduced-motion: no-preference, ela só é ligada para quem não pediu menos movimento no sistema.
É grátis mesmo?
Sim, 100% grátis. Sem cadastro, sem assinatura e sem limite de uso. Todas as ferramentas do Ferramentas123 são gratuitas e rodam direto no seu navegador.