Este blog: construído sem nenhuma classe CSS

Este blog é, ele mesmo, o primeiro projeto documentado aqui. A stack é Next.js com App Router, TypeScript e nenhuma biblioteca de estilos — nem Tailwind, nem CSS Modules, nem styled-components.

A regra

A regra que guiou todo o layout foi simples de descrever e difícil de seguir até o fim: nenhum atributo class em lugar nenhum. Toda a folha de estilos seleciona elementos HTML diretamente — header, nav, article, dl — combinados com seletores estruturais (:nth-child, :is()) e atributos nativos (href, aria-current, open) que já fariam parte do HTML de qualquer forma.

Por que

Duas razões. A primeira é estética: em 2026 praticamente todo site pessoal parece o mesmo template de componentes. Um layout que nasce das restrições da semântica HTML pura tende a parecer diferente, porque força decisões de design incomuns. A segunda é técnica: escrever CSS sem classes obriga a pensar em documento, não em componente — o que combina bem com um blog cujo conteúdo é HTML escrito à mão.

O que isso significa na prática

Tipografia

Pilha de fontes monoespaçadas do sistema, sem carregar fontes externas — mantém o visual de terminal e evita depender de next/font, que injeta uma classe no html.

Layout responsivo

Feito inteiramente com @media, clamp() e CSS Grid, direcionando body > header, body > main e body > footer.

Conteúdo

Cada post é um arquivo .tsx em content/posts/, com metadados exportados separadamente do corpo do texto.

O resultado não segue nenhum design system de 2026 — e essa é exatamente a ideia.