Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Colors] High contrast color palette #2513

Open
2 tasks
Tracked by #2517 ...
gvnmagni opened this issue Aug 26, 2024 · 0 comments
Open
2 tasks
Tracked by #2517 ...

[Colors] High contrast color palette #2513

gvnmagni opened this issue Aug 26, 2024 · 0 comments
Assignees

Comments

@gvnmagni
Copy link

gvnmagni commented Aug 26, 2024

charttt high

Introduction
High contrast mode is a new setting we plan to introduce in order to give the majority of user a more appealing experience while at the same time provide readability and accessibility to all kind of user that would need or prefer a more contrasted set of tones.

On dark theme, this setting would be applied only to a subset of elements (grids, labels) and not to charts colors, since the default color palette is already contrasted enough on dark theme to be considered accessible.

Important note: The following list of specs would be applied only to light theme, apart from where it is specified for dark theme as well.

Colors
For high contrast mode we pick colors that are by design more contrasted with background

colors high


Behind Text alternative
A little discussion with Visualisation Team is required here, we need to check our to proceed here in order to be sure that all text on top of charts can be contrasted enough to pass accessibility requirements (4.5), but this is affected by previous point as well.


Neutral colors
neutral colors

High contrast setting does not affect this set of neutral colors.


Vis as text
All colors have a contrast with background higher than 4.5
vis as text


Gradiens
gradients high

Gradients that are currently used in charts such as heatmap should be replaced with new dedicated colors.


Partition charts
partrition high

Would be great if charts that allow for additional hierarchical metrics should rely of colors from spectrum instead of calculations that often create weird results. This needs to be discussed for high cardinality partition charts.

Default mechanism would require colors to lower by one shade for every additional metric (11 > 10 > 09):
Also here, a discussed with Visualization Team is needed since we would easily create non accessible colors for lighter shades.


Grid colors
grid high

Grid labels colors
grid label high


Additional dedicated semantic colors
semantic high

There are specific contexts in which colors are used with a semantic meaning, it would be great to uniform this across the product, this set of colors reflects the current need on Discover and it is just a first attempt for an update, needs to be discussed.

Related

  1. 0 of 1
    visual refresh
    gvnmagni markov00
  2. 0 of 2
    visual refresh
    gvnmagni
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants