w3c / w3c/csswg-drafts

[css-images-4] sRGB assumption in cross-fade

Open
#9,700 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

css-images-4
Dominant language
Bikeshed
Stars
4.9k
Forks
816
PR merge metrics
PR metrics pending

Description

This issue was spun out of

In CSS Images 4, 2.6.2. cross-fade Painting it states:

For the purpose of this calculation, each pixel’s color must be in pre-multiplied sRGB.

  1. What to do with solid colors or pixel values specified in a non-sRGB colorspace is unspecified
  2. The assumption is that the interpolation happens in (gamma-encoded) sRGB space, thus giving results that are too dark
  3. There is no way to specify a different interpolation color space
  4. The order of operations (when there are more than two colors or images in the cross-fade) is unspecified.

Steps to fix this:

  1. Add a a <color-interpolation-method> token, as is already used in color-mix(), in palette-mix() and in linear, radial and conic gradients. This could be optional (with an sRGB default) or mandatory (since there are no implementations and thus no backwards compat risk)
  2. Reference the order of operations from 12. Color Interpolation so that premultiplication, handling of missing components, etc is consistent with the rest of CSS. This would need to be extended to handle missing components when there are 3 or more inputs, which looks messy, which is why pairwise interpolation is used everywhere else.
  3. Define what happens when non-sRGB colors get converted to sRGB (extended range transfer function, components can exceed the range [0,1], as specified in [10.2. The Predefined sRGB Color Space: the sRGB keyword](https://drafts.csswg.org/css-color-4/#predefined-sRGB))

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with CSS Images 4 §2.6.2, then compare CSS Color 4 §12 and the color-interpolation-method usage in color-mix(), palette-mix(), and gradients. Resolve the interpolation-space, operation-order, missing-component, and non-sRGB conversion choices, then update the cross-fade specification so each case is defined.

Written by the indexing model from the issue text.

Assessment

Tech stack
css
Domain
documentation
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.