casesandberg / casesandberg/react-color

Chrome picker input field labels don't turn white when site is in dark mode

Open
#898 3 comments 5 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
12.3k
Forks
920
PR merge metrics
No merged PRs in 30d

Description

My site is set to dark mode. When using the Chrome Picker, it looks like this :

Screenshot 2024-03-29 at 11 18 52 PM

On the hex input field, the label that states the hex code of the current color is blended into the background of the input field.

I tried setting the custom props in styles but saw that input or label wasn't something to edit :
![Screenshot 2024-03-29 at 11 21 47 PM](https://github.com/casesandberg/react-color/assets/96183717/952b2263-0d9e-458b-a747-79273209d657)

Is there a way around it? Thanks!

Contributor guide

Open the contributing guide

Research direction

Reproduce the Chrome Picker in a dark-mode site and inspect the picker’s input and label styling, including the custom props mentioned in the report. Done means the hex input label has sufficient contrast and remains readable in dark mode without breaking the picker’s existing appearance.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.