Bug 252043
Summary: | display-p3 isn't supported as interpolation color space | ||
---|---|---|---|
Product: | WebKit | Reporter: | Melvin <melvin.idema30> |
Component: | CSS | Assignee: | Nobody <webkit-unassigned> |
Status: | NEW | ||
Severity: | Trivial | CC: | heycam, m_dubet, ntim, sam, webkit-bug-importer |
Priority: | P2 | Keywords: | InRadar |
Version: | Safari Technology Preview | ||
Hardware: | Mac (Apple Silicon) | ||
OS: | macOS 13 |
Melvin
When I try to use the color-mix() function in combination with the Display-P3 color function, the function breaks. This is because the first argument, the color-space, is not supported by the color-interpolation-method as defined in CSS Color Module 5. However, it seems like CSS Color Module 5 suggests that one can give a @color-profile as color-interpolation-method in the color-mix() function like this:
color-mix(<dashed-ident>, <color> <percentage, <color>);
Expected Behavior: The color-mix() function should work correctly with the Display-P3 color, creating a mix of two colors in the specified color-space. Or at least work correctly with dashed-ident's and custom @color-profile.
Steps to Reproduce: Try to use the color-mix() function in combination with Display-P3 or @color-profile on Safari 16 or Technology Preview
Attachments | ||
---|---|---|
Add attachment proposed patch, testcase, etc. |
Tim Nguyen (:ntim)
`data:text/html,<span%20style="color:%20color-mix(in srgb, color(display-p3%201%200.5%200)%2050%,%20transparent)">dfsdfsdfsdfdsf</span>` seems to work for me.
Do you have a testcase that doesn't work for you?
Melvin
Thank you for your response Tim!
In the provided example the color-space srgb is used instead of display-p3. The function breaks if you try to use display-p3. Like this:
`data:text/html,<span%20style="color:%20color-mix(in display-p3, color(display-p3%201%200.5%200)%2050%,%20transparent)">dfsdfsdfsdfdsf</span>`
In my original comment I described using a custom color space as value in color-mix however I now realize custom color spaces aren't yet supported.
Tim Nguyen (:ntim)
Ah right, it should work according to https://drafts.csswg.org/css-color/#interpolation-space , thanks!
Sam, do you know if this is a known bug?
Radar WebKit Bug Importer
<rdar://problem/105591773>
Matthieu Dubet
Yes we don't support display-p3 yet as an interpolation method.
https://github.com/WebKit/WebKit/blob/main/Source/WebCore/css/parser/CSSPropertyParserHelpers.cpp#L2894