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鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update dark theme primary and secondary colors #18378

Closed
1 task done
rolandjitsu opened this issue Nov 15, 2019 · 8 comments 路 Fixed by #26555
Closed
1 task done

Update dark theme primary and secondary colors #18378

rolandjitsu opened this issue Nov 15, 2019 · 8 comments 路 Fixed by #26555
Labels
design: material This is about Material Design, please involve a visual or UX designer in the process

Comments

@rolandjitsu
Copy link
Contributor

rolandjitsu commented Nov 15, 2019

  • I have searched the issues of this repository and believe that this is not a duplicate.

Summary 馃挕

Material UI should follow the latest MD specs for the dark theme colors. And not just colors, this also applies for surfaces and other UI components.

Might be related to #17241.

Examples 馃寛

colors

Motivation 馃敠

I think it's important to follow the specs closely, makes it easy to align with native mobile apps that use the same MD specs.

@eps1lon
Copy link
Member

eps1lon commented Nov 15, 2019

Are these colors not available in the color palette or are you suggesting we should change the default primary and secondary color?

@eps1lon eps1lon added the design: material This is about Material Design, please involve a visual or UX designer in the process label Nov 15, 2019
@rolandjitsu
Copy link
Contributor Author

As far as I can see, these colors are not in the color palette. Furthermore, the paper and background colors do not respect the spec (elevation is achieved using a white overlay with transparency).

@oliviertassinari
Copy link
Member

oliviertassinari commented Nov 15, 2019

elevation is achieved using a white overlay with transparency

#18309?

the paper and background colors do not respect the spec

What do you mean?

these colors are not in the color palette

What's missing?

@rolandjitsu
Copy link
Contributor Author

I agree, #18309 describes part of the issue.

According to the specs, the background color and paper color is #121212. That is not the case for Material UI. Take the drawer from the docs as is on the online docs today:

Screenshot 2019-11-16 17 51 25

The background for the drawer is #424242. Though, the main background seems to be correct.

As for the colors, the default primary color is #bb86fc and default secondary is #03dac6 (in the material design spec - as seen in the image I added to the issue body). I cannot find these in any of the pink or cyan palettes. But maybe they have changed the way they aggregate these colors from the 2014 palettes.

You can find more about the dark theme guidelines in the Dark Theme section.

@oliviertassinari
Copy link
Member

oliviertassinari commented Nov 16, 2019

@rolandjitsu Ok thanks, let's close for #18309 and #18308 that cover two issues with the dark theme. If you see something else specific, please open an issue. Thanks

@rolandjitsu
Copy link
Contributor Author

@oliviertassinari sure, how about the colors? Is there another issue for this?

@oliviertassinari
Copy link
Member

oliviertassinari commented Nov 16, 2019

What's the issue with the color? You are free to pick the color you like.

@oliviertassinari oliviertassinari changed the title Use new Material Design color palette Update dark theme primary and secondary colors Nov 16, 2019
@oliviertassinari
Copy link
Member

Ok, we will come back to it for v5, in 1 year.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
design: material This is about Material Design, please involve a visual or UX designer in the process
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants