1
Mudanças Hex e RGB
Detecta modificações em valores hexadecimais e RGB, incluindo notação abreviada e variações do canal alfa.
40 casos de teste
Cores e Temas
A cor é uma das propriedades visuais mais carregadas de significado em uma interface: ela sustenta a identidade da marca, sinaliza as ações principais e organiza a hierarquia de leitura. Um tom que desvia alguns pontos em um botão de conversão é uma regressão visual invisível para os testes funcionais, mas imediatamente percebida pelos seus visitantes como um sinal de qualidade degradada. Em interfaces de negócio — dashboards bancários, ERP, back-offices de admin — um código de cor inconsistente pode até induzir erros de interpretação dos dados. Na prática, essas regressões surgem quase sempre nos mesmos contextos: redesign de um design system, troca de framework CSS, atualização de uma variável global do tipo --brand-primary, introdução de um dark mode mal propagado, ou conversão silenciosa de um formato colorimétrico para outro durante um build. As propriedades CSS personalizadas amplificam o problema: alterar um único token às vezes impacta dezenas de componentes espalhados por centenas de páginas, e nenhum desenvolvedor consegue manter mentalmente o mapeamento completo das dependências. O Delta-QA trata esse ponto comparando as capturas de referência e as novas capturas pixel a pixel, depois aplicando uma análise perceptual que tolera o ruído de renderização mas alerta sobre qualquer desvio de tom significativo. A ferramenta reconhece os formatos RGB, HSL, OKLCH e as variáveis CSS modernas, e sinaliza tanto as mudanças completas de paleta quanto os desvios sutis de poucos pontos em uma nuance próxima. O relatório visual gerado localiza com precisão as zonas afetadas em cada snapshot, o que permite à equipe de QA validar um redesign sem reler cada linha da folha de estilos, com testes visuais e comparação de páginas confiáveis.
O que detectamos
2
Variações HSL e HSLA
Captura ajustes de matiz, saturação e luminosidade, mesmo quando a diferença visual e sutil para o olho humano.
3
Espaços de cor modernos
Suporta OKLCH, LCH, Lab e outros espaços de cor de ampla gama usados em sistemas de design modernos.
4
Propriedades CSS personalizadas
Rastreia mudanças em variáveis CSS (--brand-color, --bg-primary) que se propagam por todo o sistema de design.
5
Alternância modo escuro / claro
Detecta regressões de tema onde elementos não se adaptam corretamente entre os modos escuro e claro.
6
Gradientes e canais alfa
Identifica mudanças em gradientes lineares, radiais e cônicos, bem como modificações de transparência.
Exemplo interativo
Veja exatamente o que o Delta-QA detecta. Compare as duas versões lado a lado.
Antes
Depois
Cenários reais
🎯
A variável CSS que muda tudo
Um desenvolvedor atualiza o design system e altera a variável --brand-primary para corrigir um contraste no footer. Efeito colateral: a cor de todos os botões, links e cabeçalhos do site muda de um azul escuro para um azul desbotado. O botão "Adicionar ao carrinho" quase se confunde com o fundo branco — os visitantes não o percebem mais de primeira. O QA verificou o footer (a área modificada), não as outras 40 páginas que usam essa mesma variável. Delta-QA compara as capturas antes/depois e destaca a mudança de tom em cada elemento afetado, em todas as páginas.
⚠️
O dark mode que esquece um componente
Um desenvolvedor adiciona um novo bloco de depoimentos de clientes. No modo claro, tudo fica perfeito. Mas no dark mode, o bloco mantém fundo branco e texto preto — um retângulo ofuscante no meio de uma página escura. Seus visitantes noturnos levam um flash nos olhos. Verificar manualmente cada componente em cada tema é irreal quando você tem 30 componentes e 2 temas. Delta-QA captura o site em modo escuro e compara com a referência: o retângulo branco do componente esquecido salta a vista imediatamente no diff.
💡
O degradê que desaparece
Durante uma atualização do framework CSS, uma classe de degradê é renomeada. O build passa sem erros, mas o degradê da página inicial desaparece — substituído por um fundo branco liso. A página perde profundidade e identidade de marca, parece um template padrão. Era uma atualização menor do framework, ninguém pensou em retestar visualmente a homepage. Delta-QA compara as capturas e detecta o desaparecimento do degradê — toda a área que passa de colorida a branca se destaca claramente no diff.
Pronto para detectar toda regressão visual?
Baixe o Delta-QA e comece a detectar mudanças CSS nas suas páginas web — sem código.