Loading…
Dataset 20261011-0550-f160c57 · measured 2026-10-11 05:50 UTC
background-blend-mode
◐matches Chrome on some values8 of 12 examples match Chromecompositing-2
Some of the examples match Chrome and some do not. The count beside the verdict says how many — 11 of 12 — and the values that differ are listed on the property page. It is neither a pass nor a failure, and filing it under either would be a lie in one direction.
Here: 8 of 12 examples match Chrome. The 4 that do not: background-blend-mode:color-burn, background-blend-mode:color-dodge, background-blend-mode:difference, background-blend-mode:exclusion — shown first below, each with its difference map.
What the specification says
- Initial value
- normal
- Applies to
- All HTML elements
- Inherited
- no
- Percentages
- N/A
- Computed value
- as specified
- Syntax
- <'mix-blend-mode'>#
The measurements
12 examples, 8 of them matching Chrome, the rest first. Each is one declaration on a small page, drawn by Chrome and by our engine. Drag the handle to wipe between them.
background-blend-mode:color-burn✕renders differently
Our renderChrome9,780 pixels differ from Chrome, the largest by 255 of 255 on one channel.
- Differing pixels
- 9,780
- Max channel delta
- 255
background-blend-mode:color-dodge✕renders differently
Our renderChrome5,020 pixels differ from Chrome, the largest by 255 of 255 on one channel.
- Differing pixels
- 5,020
- Max channel delta
- 255
background-blend-mode:difference✕renders differently
Our renderChrome4,837 pixels differ from Chrome, the largest by 255 of 255 on one channel.
- Differing pixels
- 4,837
- Max channel delta
- 255
background-blend-mode:exclusion✕renders differently
Our renderChrome4,837 pixels differ from Chrome, the largest by 255 of 255 on one channel.
- Differing pixels
- 4,837
- Max channel delta
- 255
background-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
background-blend-mode:screen✓pixel-exactOur renderChromeIdentical to Chrome: nothing differs, so there is no difference map to show.
- Differing pixels
- 0
- Max channel delta
- 0
background-blend-mode:overlay✓pixel-exact
Our renderChromeIdentical to Chrome: nothing differs, so there is no difference map to show.
- Differing pixels
- 0
- Max channel delta
- 0
background-blend-mode:soft-light✓pixel-exactOur renderChromeIdentical to Chrome: nothing differs, so there is no difference map to show.
- Differing pixels
- 0
- Max channel delta
- 0
background-blend-mode:hue≈below the visible threshold
Our renderChrome4,760 pixels differ from Chrome, the largest by 1 of 255 on one channel.
- Differing pixels
- 4,760
- Max channel delta
- 1
background-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
background-blend-mode:color≈below the visible thresholdOur renderChrome4,760 pixels differ from Chrome, the largest by 1 of 255 on one channel.
- Differing pixels
- 4,760
- Max channel delta
- 1
background-blend-mode:luminosity≈below the visible threshold
Our renderChrome3,055 pixels differ from Chrome, the largest by 1 of 255 on one channel.
- Differing pixels
- 3,055
- Max channel delta
- 1
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 | not measured |
| color-burn | ✕renders differently |
| lighten | ✓pixel-exact |
| screen | ✓pixel-exact |
| color-dodge | ✕renders differently |
| overlay | ✓pixel-exact |
| soft-light | ✓pixel-exact |
| hard-light | not measured |
| difference | ✕renders differently |
| exclusion | ✕renders differently |
| hue | ≈below the visible threshold |
| saturation | ✓pixel-exact |
| color | ≈below the visible threshold |
| luminosity | ≈below the visible threshold |
| plus-lighter | not measured |
| normal | not measured |
Measured against Chrome 148.0.7778.96 on 2026-10-11, with up to 40 candidate values tried per property. All properties · How the measurement works