Calculadora de Tamanho Fonte Titulo Corpo

Relação entre Tamanho de Título e Corpo

A hierarquia tipográfica depende de proporções consistentes entre títulos e corpo de texto. Uma escala modular multiplica o tamanho do corpo por um fator constante a cada passo. Proporções comuns incluem a razão áurea φ = 1.618, Quarta Perfeita 1.333 e Terça Maior 1.25. A fórmula geral é tamanho_n = corpo × razão^n, onde n é o número do passo.

Partindo de corpo 16px, uma escala 1.25 gera h3 = 20px, h2 = 25px, h1 = 31–39px. Já uma escala 1.5 mais dramática produz h1 = 48–54px, ideal para hero headings. A escala padrão do Tailwind vai de text-sm (14px) a text-7xl (72px), seguindo aproximadamente progressão 1.2–1.25 com saltos customizados nos extremos.

Aplicações

Usado em design systems, brand guidelines, layouts editoriais, tipografia web (CSS font-size) e design para impressão. Ferramentas como Type-Scale.com e Modularscale.com geram essas proporções. Material Design, Apple HIG e IBM Carbon publicam escalas recomendadas.

Perguntas frequentes

Devo usar a razão áurea? φ = 1.618 produz contraste dramático ideal para capas editoriais, mas pode ser agressivo demais em UI denso. Para dashboards, 1.2–1.333 funciona melhor.

Qual tamanho de corpo começar? 16px é o padrão web e mínimo recomendado para acessibilidade. Impressos usam 9–11pt. Mobile pode subir para 17–18px por legibilidade.

Posso misturar escalas? Sim — muitos sistemas usam escala mais apertada (1.2) para labels de UI e mais aberta (1.333) para páginas de marketing, mantendo a mesma base de corpo.