1
Hex & RGB Changes
Detects modifications in hexadecimal and RGB color values, including shorthand notation changes and alpha channel variations.
40 test cases
Colors & Themes
Color is one of the most impactful visual properties. A single shade change can break brand consistency, confuse users, or indicate a regression in your theme system. Delta-QA detects every color variation — from obvious swaps to near-imperceptible shifts across all modern CSS color formats.
What we detect
2
HSL & HSLA Variations
Catches hue, saturation, and lightness adjustments, even when the visual difference is subtle to the human eye.
3
Modern Color Spaces
Supports OKLCH, LCH, Lab, and other wide-gamut color spaces used in modern design systems.
4
CSS Custom Properties
Tracks changes in CSS variables (--brand-color, --bg-primary) that cascade through your entire design system.
5
Dark / Light Mode Switches
Detects theme toggle regressions where elements fail to adapt correctly between dark and light modes.
6
Gradients & Alpha Channels
Identifies changes in linear, radial, and conic gradients, as well as transparency and alpha channel modifications.
Live example
See exactly what Delta-QA detects. Compare the two versions side by side.
Before
After
Real-world scenarios
🎯
The CSS variable that changes everything
A developer updates the design system and changes the --brand-primary variable to fix a contrast issue on the footer. Side effect: the color of every button, link, and heading across the site shifts from dark blue to a washed-out blue. The "Add to Cart" button nearly blends into the white background — visitors no longer spot it at first glance. QA checked the footer (the area that was modified), not the 40 other pages using that same variable. Delta-QA compares before/after screenshots and highlights the color shift on every affected element, across all pages.
⚠️
The dark mode that forgets a component
A developer adds a new customer testimonials block. In light mode, everything looks great. But in dark mode, the block keeps its white background and black text — a blinding rectangle in the middle of a dark page. Your nighttime visitors get a flash in their eyes. Manually checking every component in every theme is unrealistic when you have 30 components and 2 themes. Delta-QA captures the site in dark mode and compares against the reference: the white rectangle of the forgotten component jumps out immediately in the diff.
💡
The gradient that disappears
During a CSS framework update, a gradient class gets renamed. The build passes without errors, but the homepage gradient disappears — replaced by a flat white background. The page loses its depth and brand identity, looking like a default template. It was a minor framework update, nobody thought to visually retest the homepage. Delta-QA compares screenshots and detects the gradient's disappearance — the entire area going from colorful to white stands out clearly in the diff.
Ready to catch every visual regression?
Download Delta-QA and start detecting CSS changes in your web pages — no code required.