[Webkit-unassigned] [Bug 288070] New: Safari- Relative Colors + Keywords

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Wed Feb 19 22:40:28 PST 2025


https://bugs.webkit.org/show_bug.cgi?id=288070

            Bug ID: 288070
           Summary: Safari- Relative Colors + Keywords
           Product: WebKit
           Version: Safari 17
          Hardware: Mac (Apple Silicon)
                OS: Other
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: New Bugs
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: clevermissfox at gmail.com

I am using Live Server/VS Code on macOs Sonoma Version 14.6.1 (23G93), Safari 17.6. 

In my stylesheet, I am also using @layers which may or may not be relevant. 

I assigned these relevant styles: 

```css
@layer reset, elements, base, project-styles, scroll-styles;
@layer reset {
:root {
    --clr-bg-body: canvas;
    --clr-bg-card: oklch(from var(--clr-bg-body) calc(l - 0.02) c h / 1);
}
html {color-scheme: dark;}
.card { background-color: var(--clr-bg-card); }
}
``` 
Seems to work in chrome fine but in Safari, I always get the computed value for background color as `rgb( 0, 0, 0 , 0)`; 
I checked support:
```css
@supports (color: rgb(from red r g b) ) {
:root {
--clr-bg-card: hotpink;
}
} ```

This passed. I then tried color-mix
```css
:root {
--clr-bg-card: color-mix(in oklch, canvas, black 20%);
--clr-bg-card: color-mix(in oklch, var(--clr-bg-body), black 20%);
} ```

Both passed and color-mix worked with the keywords; 

No matter what color space I use (rgb, hsl, oklch) , and no matter whether i refer to custom properties (e.g. `--clr-bg-body`) or just use the `canvas` or `canvasText` or `currentColor` keywords, my computed value of this color is transparent, or more specifically `rgba(0,0,0,0)`.  NOTE: I also removed all the @layer styles to check if they were interfering - same results.

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20250220/147d5b5e/attachment.htm>


More information about the webkit-unassigned mailing list