1
Mudancas de familia tipografica
Detecta quando uma fonte alternativa renderiza em vez da principal, ou quando as declaracoes font-family mudam.
45 casos de teste
Tipografia
A tipografia e a espinha dorsal da legibilidade. Mesmo uma pequena mudanca no peso da fonte pode afetar como os usuarios percebem seu conteudo. O Delta-QA monitora cada propriedade tipografica para garantir renderizacao exata.
O que detectamos
2
Peso e estilo
Captura variacoes de peso (400 vs 500, bold vs semibold) e mudancas de estilo (italico, obliquo).
3
Tamanho e escala
Rastreia mudancas de font-size em px, rem, em e unidades viewport, incluindo clamp() e tipografia fluida.
4
Altura de linha e ritmo vertical
Monitora ajustes de line-height que podem perturbar o ritmo vertical e o fluxo geral das paginas.
5
Espacamento de letras e palavras
Detecta mudancas em letter-spacing e word-spacing que afetam a densidade e legibilidade do texto.
6
Decoracao e transformacao
Identifica modificacoes em sublinhados, tachados, text-transform (maiusculas/minusculas) e text-overflow.
Exemplo interativo
Veja exatamente o que o Delta-QA detecta. Compare as duas versões lado a lado.
Antes
Depois
Cenários reais
🎯
A fonte que para de carregar
Um desenvolvedor roda npm update e quebra o import da fonte Inter sem saber. O navegador muda silenciosamente para Arial. Os espacamentos mudam, alguns titulos pulam para duas linhas, um botao transborda seu container — todo o layout fica sutilmente desalinhado. A mudanca parecia inofensiva (uma atualizacao de dependencias), foi mergeada sem revisao visual. Delta-QA compara as capturas das duas versoes e destaca cada deslocamento de texto, cada titulo que pula de linha e cada transbordamento causado pela troca de fonte.
⚠️
O line-height que quebra os cards de produto
Um desenvolvedor altera o line-height global para melhorar a legibilidade do blog. Efeito colateral: os titulos de produto que cabiam em uma linha agora ocupam duas no catalogo. Os cards nao tem mais a mesma altura, o grid fica irregular — um catalogo "torto" que inspira menos confianca. O QA verificou o blog (a pagina modificada), nao o catalogo que usa os mesmos estilos globais. Delta-QA compara as capturas e destaca cada card cuja altura mudou — os desalinhamentos no grid saltam a vista imediatamente.
💡
O font-weight invisivel
O designer definiu um font-weight semi-bold (600) para os cabecalhos. Ao longo de varios sprints, diferentes desenvolvedores usam ora 600, ora 700. Resultado: alguns cabecalhos sao visivelmente mais grossos que outros na mesma pagina. A hierarquia visual fica inconsistente — um titulo de secao parece mais importante que outro sem motivo. O designer nunca foi notificado dessas mudancas graduais. Delta-QA compara as capturas e destaca as variacoes de espessura entre cabecalhos — os titulos mais pesados se destacam na sobreposicao.
Pronto para detectar toda regressao visual?
Baixe o Delta-QA e comece a detectar mudancas CSS nas suas paginas web — sem codigo.