argyleink / open-props

CSS custom properties to help accelerate adaptive and consistent design.

Home Page:https://open-props.style

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Extend --HDcolor custom MQ with color-gamut

cbontems opened this issue · comments

My MacBook pro has a p3 capable display, but returns false to the --HDcolor media query.

I ended up extending this media query this way:
@custom-media --HDcolor (dynamic-range: high) or (color-gamut: p3);

This way, I can benefit from these gorgeous colors.
I am probably not the only one in this situation, so if this sounds like a good update, I would be happy to submit a PR.

oh dang, that stinks, yeah, let's fix that.

have you found if there's a Chrome bug about it? (assuming you're using Chrome here?)
PR is welcome here 👍🏻

that is curious tho.. i have a macbook pro and dynamic-range is true for it's screen, curious why yours isn't.

Hi Adam!
Well, I am using Chrome, but this is not Chrome specific. Safari is the only one to return true. Chrome / Brave / Arc / Firefox all return false.

When using (color-gamut: p3), only Firefox keeps denying me the right to display nice colors...

I use a quite old but faithful 2018 15" mbp.

By the way, Chrome dev tools allow to emulate the color-gamut MQ, but not the dynamic-range MQ. Is there a specific reason for that?