Skip to main content

ColorScheme

A set of more than 40 colors based on the Material spec that can be used to configure the color properties of most components. Read more about color schemes in here.

ColorScheme class has the following properties:

background

A color that typically appears behind scrollable content.

Value is of type ColorValue.

error

The color to use for input validation errors, e.g. for TextField.error_text.

Value is of type ColorValue.

error_container

A color used for error elements needing less emphasis than error.

Value is of type ColorValue.

inverse_primary

An accent color used for displaying a highlight color on inverse_surface backgrounds, like button text in a SnackBar.

Value is of type ColorValue.

inverse_surface

A surface color used for displaying the reverse of what’s seen in the surrounding UI, for example in a SnackBar to bring attention to an alert.

Value is of type ColorValue.

on_background

A color that's clearly legible when drawn on background.

Value is of type ColorValue.

on_error

A color that's clearly legible when drawn on error.

Value is of type ColorValue.

on_error_container

A color that's clearly legible when drawn on error_container.

Value is of type ColorValue.

on_inverse_surface

A color that's clearly legible when drawn on inverse_surface.

Value is of type ColorValue.

on_primary

A color that's clearly legible when drawn on primary.

Value is of type ColorValue.

on_primary_container

A color that's clearly legible when drawn on primary_container.

Value is of type ColorValue.

on_primary_fixed

Value is of type ColorValue.

on_primary_fixed_variant

Value is of type ColorValue.

on_secondary

A color that's clearly legible when drawn on secondary.

Value is of type ColorValue.

on_secondary_container

A color that's clearly legible when drawn on secondary_container.

Value is of type ColorValue.

on_secondary_fixed

Value is of type ColorValue.

on_secondary_fixed_variant

Value is of type ColorValue.

on_surface

A color that's clearly legible when drawn on surface.

Value is of type ColorValue.

on_surface_variant

A color that's clearly legible when drawn on surface_variant.

Value is of type ColorValue.

on_tertiary

A color that's clearly legible when drawn on tertiary.

Value is of type ColorValue.

on_tertiary_container

A color that's clearly legible when drawn on tertiary_container.

Value is of type ColorValue.

on_tertiary_fixed

Value is of type ColorValue.

on_tertiary_fixed_variant

Value is of type ColorValue.

outline

A utility color that creates boundaries and emphasis to improve usability.

Value is of type ColorValue.

outline_variant

A utility color that creates boundaries for decorative elements when a 3:1 contrast isn’t required, such as for dividers or decorative elements.

Value is of type ColorValue.

primary

The color displayed most frequently across your app’s screens and components.

Value is of type ColorValue.

primary_container

A color used for elements needing less emphasis than primary.

Value is of type ColorValue.

primary_fixed

Value is of type ColorValue.

primary_fixed_dim

Value is of type ColorValue.

scrim

A color use to paint the scrim around of modal components.

Value is of type ColorValue.

secondary

An accent color used for less prominent components in the UI, such as filter chips, while expanding the opportunity for color expression.

Value is of type ColorValue.

secondary_container

A color used for elements needing less emphasis than secondary.

Value is of type ColorValue.

secondary_fixed

Value is of type ColorValue.

secondary_fixed_dim

Value is of type ColorValue.

surface_bright

Value is of type ColorValue.

surface_container

Value is of type ColorValue.

shadow

A color use to paint the drop shadows of elevated components.

Value is of type ColorValue.

surface

The background color for widgets like Card.

Value is of type ColorValue.

surface_container_high

Value is of type ColorValue.

surface_container_low

Value is of type ColorValue.

surface_container_lowest

Value is of type ColorValue.

surface_dim

Value is of type ColorValue.

surface_tint

A color used as an overlay on a surface color to indicate a component's elevation.

Value is of type ColorValue.

surface_variant

A color variant of surface that can be used for differentiation against a component using surface.

Value is of type ColorValue.

tertiary

A color used as a contrasting accent that can balance primary and secondary colors or bring heightened attention to an element, such as an input field.

Value is of type ColorValue.

tertiary_container

A color used for elements needing less emphasis than tertiary.

Value is of type ColorValue.

tertiary_fixed

Value is of type ColorValue.

tertiary_fixed_dim

Value is of type ColorValue.