1
Object-fit & Position
Detects changes in how images fill their containers: cover, contain, fill, and object-position adjustments.
25 test cases
Images & SVG
Images and vector graphics are central to modern web design. A broken filter, a shifted object-fit, or a modified SVG path can fundamentally alter the visual identity of your pages. Delta-QA compares these elements with pixel precision.
What we detect
2
CSS Filters
Monitors blur, brightness, contrast, grayscale, hue-rotate, saturate, sepia, and drop-shadow filters.
3
SVG Modifications
Catches SVG path changes, fill/stroke color modifications, and viewBox adjustments.
4
Clip-path Changes
Detects clip-path shape modifications using circle(), ellipse(), polygon(), and inset() functions.
5
Background Images
Tracks background-image, background-size, background-position, and background-repeat changes.
Live example
See exactly what Delta-QA detects. Compare the two versions side by side.
Before
After
Real-world scenarios
🎯
The product image that won't load
A developer reorganizes the asset folder structure and breaks some product image paths. The browser shows a broken image icon or raw alt text where the photo should be. Your customers see "product-photo-123.jpg" instead of the actual product — nobody buys what they can't see. The refactor touched file structure, not code — nobody visually retested the product pages. Delta-QA compares screenshots and immediately detects the broken icon in place of the photo.
⚠️
The image that overflows
A developer changes a max-width rule for a special case and, through CSS cascade, all images on the site lose their size constraint. A 2000px-wide image overflows its container, a horizontal scrollbar appears — the layout is broken, especially on mobile. The developer tested their specific case, not the 15 other templates using that same rule. Delta-QA compares screenshots and highlights the overflowing image along with the horizontal scrollbar that appeared.
💡
The aspect ratio that changes
A developer modifies the homepage banner container dimensions and the image ratio shifts from 16:9 to 4:3. The image is stretched: faces are distorted, the logo is squashed — visitors see an amateurish image where there used to be a polished banner. It's a container change, not an image change — the developer didn't think to check the visual output. Delta-QA compares screenshots and highlights the distortion — the altered proportions stand 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.