search

mui / material-ui

Material UI: Comprehensive React component library that implements Google's Material Design. Free forever.
https://mui.com/material-ui/
MIT License
93.19k stars 32.08k forks source link

[Theme] Simplify Custom Branding #18983

Closed aress31 closed 4 years ago

aress31 commented 4 years ago

Summary 💡

The Material Design documentation states that custom branding is possible by applying a primary colour as an overlay (at 8% opacity) on top of the default #121212 background colour. In the case of a dark theme, the desaturated colour would be applied as an overlay. See https://material.io/design/color/dark-theme.html#properties.

Because the primary colour is already defined by users, e.g. red, purple, etc. I am thinking that a boolean option could be added to the theme object to set automatic background branding.

Examples 🌈

For example, if I set my primary colour to the red object and enable this suggested boolean, let's call it enableBranding, then the background colour and other surfaces colour would be automatically computed by adding this aforementioned overlay.

Motivation 🔦

Simplifying theming and giving more customisation options.

oliviertassinari commented 4 years ago

@aress31 We would encourage a custom override for now. We will try to rethink the palette for v5.