Skip to content

[Theme] support for 'on' colors?  #17241

@petegivens

Description

@petegivens

The Material Design docs advocate for theme palette values for "on" colors like onPrimary, onSurface, etc. Are there plans to support these in the theme.palette object?

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

Summary 💡

I'm just looking to understand the philosophy and if this is on the roadmap. I'm working on a white label application that needs to support a robust theming solution. We have embraced the (newer) MD theme model where svg strokes and typography are colored based on these "on" colors. If text appears on top of a primary colored surface, it uses the onPrimary color.

We have also extended this to the color prop on small components. E.G. our Button can take color="primary" or color="onPrimary".
image

When I look through Material UI's default theme, it looks like the palette shape hasn't changed since MD1. The palette still supports accent colors, for example, which are no longer part of the MD2 color palette recommendations. I assume that the palette.primary.contrastText value is supposed to represent this?

Can we expect to see support for these 'on' colors in the theme.palette object or in the component APIs in the future?

Examples 🌈

image

image

Metadata

Metadata

Assignees

No one assigned

    Labels

    design: materialThis is about Material Design, please involve a visual or UX designer in the processdiscussion

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions