Loading…
Dataset 20260827-2142-2f1b575 · measured 2026-08-27 21:42 UTC
mix-blend-mode
≈below the visible thresholdcompositing-2
Differs from Chrome only inside the measured anti-aliasing band (maximum channel distance 3 of 255). Curves, rotation and gradients land here.
What the specification says
- Initial value
- normal
- Applies to
- All elements. In SVG, it applies to container elements, graphics elements and graphics referencing elements. [SVG11]
- Inherited
- no
- Percentages
- N/A
- Computed value
- as specified
- Syntax
- <blend-mode> | plus-lighter
The measurements
Each example is one declaration on a small page, drawn by Chrome and by our engine. Drag the handle to wipe between them.
mix-blend-mode:multiply≈below the visible threshold
Our renderChrome8,000 pixels differ from Chrome, the largest by 1 of 255 on one channel.
- Differing pixels
- 8,000
- Max channel delta
- 1
mix-blend-mode:color-burn✓pixel-exact
Our renderChromeIdentical to Chrome: nothing differs, so there is no difference map to show.
- Differing pixels
- 0
- Max channel delta
- 0
mix-blend-mode:lighten✓pixel-exact
Our renderChromeIdentical to Chrome: nothing differs, so there is no difference map to show.
- Differing pixels
- 0
- Max channel delta
- 0
mix-blend-mode:screen≈below the visible threshold
Our renderChrome8,000 pixels differ from Chrome, the largest by 1 of 255 on one channel.
- Differing pixels
- 8,000
- Max channel delta
- 1
mix-blend-mode:color-dodge✓pixel-exact
Our renderChromeIdentical to Chrome: nothing differs, so there is no difference map to show.
- Differing pixels
- 0
- Max channel delta
- 0
mix-blend-mode:overlay≈below the visible threshold
Our renderChrome8,000 pixels differ from Chrome, the largest by 1 of 255 on one channel.
- Differing pixels
- 8,000
- Max channel delta
- 1
mix-blend-mode:soft-light≈below the visible threshold
Our renderChrome8,000 pixels differ from Chrome, the largest by 1 of 255 on one channel.
- Differing pixels
- 8,000
- Max channel delta
- 1
mix-blend-mode:hard-light≈below the visible threshold
Our renderChrome8,000 pixels differ from Chrome, the largest by 1 of 255 on one channel.
- Differing pixels
- 8,000
- Max channel delta
- 1
mix-blend-mode:difference✓pixel-exact
Our renderChromeIdentical to Chrome: nothing differs, so there is no difference map to show.
- Differing pixels
- 0
- Max channel delta
- 0
mix-blend-mode:exclusion≈below the visible threshold
Our renderChrome7,996 pixels differ from Chrome, the largest by 2 of 255 on one channel.
- Differing pixels
- 7,996
- Max channel delta
- 2
mix-blend-mode:hue✓pixel-exact
Our renderChromeIdentical to Chrome: nothing differs, so there is no difference map to show.
- Differing pixels
- 0
- Max channel delta
- 0
mix-blend-mode:saturation✓pixel-exact
Our renderChromeIdentical to Chrome: nothing differs, so there is no difference map to show.
- Differing pixels
- 0
- Max channel delta
- 0
Which values were measured
“Supported” on one example means “supported at the value we tried”. The property’s declared grammar has 17 branches; 12 of them carry a measurement. The publishing ceiling is 12 examples per property — a branch past it is left out by our choice, not by accident.
| Value | Measured |
|---|---|
| darken | not measured |
| multiply | ≈below the visible threshold |
| color-burn | ✓pixel-exact |
| lighten | ✓pixel-exact |
| screen | ≈below the visible threshold |
| color-dodge | ✓pixel-exact |
| overlay | ≈below the visible threshold |
| soft-light | ≈below the visible threshold |
| hard-light | ≈below the visible threshold |
| difference | ✓pixel-exact |
| exclusion | ≈below the visible threshold |
| hue | ✓pixel-exact |
| saturation | ✓pixel-exact |
| color | not measured |
| luminosity | not measured |
| plus-lighter | not measured |
| normal | not measured |
Measured against Chrome 148.0.7778.96 on 2026-08-27, with up to 40 candidate values tried per property. All properties · How the measurement works