Skip to content

css.properties.accent-color - Safari does support accent-color #29793

Description

@atopal

What type of issue is this?

Incorrect support data (example: BrowserX says "86" but support was added in "40")

What information was incorrect, unhelpful, or incomplete?

The text says

Safari does not maintain minimum contrast for legibility of the control. See bug 244233.

Instead of changing the indicator color (checkbox from white to black or vice versa) Safari changes the luminance of the accent color, so certain accent colors are simply not possible, like white in light mode. The webkit issue seems to be only concerned with iOS where the above didn't actually happen until recently, hence why the report says that on iOS you get white indicator on white background, while desktop does white indicator on dark grey background (and all other browsers switch the indicator color instead).

Now, I'm not sure what exactly the WebKit/WebKit#48944 that solves that issue in Safari on iOS actually changes. Maybe it was not preserving the hue on desktop before and it does now?

What browsers does this problem apply to, if applicable?

Safari

What did you expect to see?

Not sure how this should be marked, since the visual behavior is quite different and certain accent colors are still not possible, but it seems like with the PR at leas the contrast issues are addressed? I also don't know when the behavior changed on iOS and whether the behavior changed at all on desktop (the PR seems to indicate that?).

Did you test this? If so, how?

On current versions of Safari for iOS and desktop

Can you link to any release notes, bugs, pull requests, or MDN pages related to this?

No response

Do you have anything more you want to share?

No response

MDN URL

https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/accent-color

MDN metadata

MDN page report details
  • Query: css.properties.accent-color
  • Report started: 2026-06-02T10:55:24.319Z

Metadata

Metadata

Assignees

No one assigned

    Labels

    data:cssCompat data for CSS features. https://developer.mozilla.org/docs/Web/CSSneeds triageThis issue needs to be confirmed

    Type

    No type

    Fields

    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions