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.
Properties
error- The color to use for input validation errors, e.g.error_container- A color used for error elements needing less emphasis thanerror.inverse_primary- An accent color used for displaying a highlight color oninverse_surfacebackgrounds, like button text in aSnackBar.inverse_surface- A surface color used for displaying the reverse of what’s seen in the surrounding UI, for example in aSnackBarto bring attention to an alert.outline- A utility color that creates boundaries and emphasis to improve usability.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.primary- The color displayed most frequently across your app's screens and components.primary_container- A color used for elements needing less emphasis thanprimary.primary_fixed- A substitute forprimary_containerthat's the same color for the dark and light themes.primary_fixed_dim- A color used for elements needing more emphasis thanprimary_fixed.scrim- A color use to paint the scrim around of modal components.secondary- An accent color used for less prominent components in the UI, such as filterChips, while expanding the opportunity for color expression.secondary_container- A color used for elements needing less emphasis thansecondary.secondary_fixed- A substitute forsecondary_containerthat's the same color for the dark and light themes.secondary_fixed_dim- A color used for elements needing more emphasis thansecondary_fixed.shadow- A color use to paint the drop shadows of elevated components.surface- The background color for widgets likeCard.surface_bright- A color that's always the lightest in the dark or light theme.surface_container- A recommended color role for a distinct area within the surface.surface_container_high- A surface container color with a darker tone.surface_container_highest- A surface container color with the darkest tone.surface_container_low- A surface container color with a lighter tone that creates less emphasis thansurface_containerbut more emphasis thansurface_container_lowest.surface_container_lowest- A surface container color with the lightest tone and the least emphasis relative to the surface.surface_dim- A color that's always darkest in the dark or light theme.surface_tint- A color used as an overlay on a surface color to indicate a component's elevation.tertiary- A color used as a contrasting accent that can balanceprimaryandsecondarycolors or bring heightened attention to an element, such as an input field.tertiary_container- A color used for elements needing less emphasis thantertiary.tertiary_fixed- A substitute fortertiary_containerthat's the same color for dark and light themes.tertiary_fixed_dim- A color used for elements needing more emphasis thantertiary_fixed.
Events
on_error- A color that's clearly legible when drawn onerror.on_error_container- A color that's clearly legible when drawn onerror_container.on_inverse_surface- A color that's clearly legible when drawn oninverse_surface.on_primary- A color that's clearly legible when drawn onprimary.on_primary_container- A color that's clearly legible when drawn onprimary_container.on_primary_fixed- A color that is used for text and icons that exist on top of elements havingprimary_fixedcolor.on_primary_fixed_variant- A color that provides a lower-emphasis option for text and icons thanon_primary_fixed.on_secondary- A color that's clearly legible when drawn onsecondary.on_secondary_container- A color that's clearly legible when drawn onsecondary_container.on_secondary_fixed- A color that is used for text and icons that exist on top of elements havingsecondary_fixedcolor.on_secondary_fixed_variant- A color that provides a lower-emphasis option for text and icons thanon_secondary_fixed.on_surface- A color that's clearly legible when drawn onsurface.on_surface_variant- A color that's clearly legible when drawn onsurface_container_highest.on_tertiary- A color that's clearly legible when drawn ontertiary.on_tertiary_container- A color that's clearly legible when drawn ontertiary_container.on_tertiary_fixed- A color that is used for text and icons that exist on top of elements havingtertiary_fixedcolor.on_tertiary_fixed_variant- A color that provides a lower-emphasis option for text and icons thanon_tertiary_fixed.
Properties
errorclass-attributeinstance-attribute
error: Optional[ColorValue] = NoneThe color to use for input validation errors, e.g. for flet.FormFieldControl.error.
error_containerclass-attributeinstance-attribute
error_container: Optional[ColorValue] = NoneA color used for error elements needing less emphasis than error.
inverse_primaryclass-attributeinstance-attribute
inverse_primary: Optional[ColorValue] = NoneAn accent color used for displaying a highlight color on inverse_surface
backgrounds, like button text in a SnackBar.
inverse_surfaceclass-attributeinstance-attribute
inverse_surface: Optional[ColorValue] = NoneA 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.
outlineclass-attributeinstance-attribute
outline: Optional[ColorValue] = NoneA utility color that creates boundaries and emphasis to improve usability.
outline_variantclass-attributeinstance-attribute
outline_variant: Optional[ColorValue] = NoneA utility color that creates boundaries for decorative elements when a 3:1 contrast isn’t required, such as for dividers or decorative elements.
primaryclass-attributeinstance-attribute
primary: Optional[ColorValue] = NoneThe color displayed most frequently across your app's screens and components.
primary_containerclass-attributeinstance-attribute
primary_container: Optional[ColorValue] = NoneA color used for elements needing less emphasis than primary.
primary_fixedclass-attributeinstance-attribute
primary_fixed: Optional[ColorValue] = NoneA substitute for primary_container that's the same color for the dark and light themes.
primary_fixed_dimclass-attributeinstance-attribute
primary_fixed_dim: Optional[ColorValue] = NoneA color used for elements needing more emphasis than primary_fixed.
scrimclass-attributeinstance-attribute
scrim: Optional[ColorValue] = NoneA color use to paint the scrim around of modal components.
secondaryclass-attributeinstance-attribute
secondary: Optional[ColorValue] = NoneAn accent color used for less prominent components in the UI, such as filter Chips, while expanding the opportunity for color expression.
secondary_containerclass-attributeinstance-attribute
secondary_container: Optional[ColorValue] = NoneA color used for elements needing less emphasis than secondary.
secondary_fixedclass-attributeinstance-attribute
secondary_fixed: Optional[ColorValue] = NoneA substitute for secondary_container that's the same color for the dark and light themes.
secondary_fixed_dimclass-attributeinstance-attribute
secondary_fixed_dim: Optional[ColorValue] = NoneA color used for elements needing more emphasis than secondary_fixed.
shadowclass-attributeinstance-attribute
shadow: Optional[ColorValue] = NoneA color use to paint the drop shadows of elevated components.
surfaceclass-attributeinstance-attribute
surface: Optional[ColorValue] = NoneThe background color for widgets like Card.
surface_brightclass-attributeinstance-attribute
surface_bright: Optional[ColorValue] = NoneA color that's always the lightest in the dark or light theme.
surface_containerclass-attributeinstance-attribute
surface_container: Optional[ColorValue] = NoneA recommended color role for a distinct area within the surface.
surface_container_highclass-attributeinstance-attribute
surface_container_high: Optional[ColorValue] = NoneA surface container color with a darker tone.
surface_container_highestclass-attributeinstance-attribute
surface_container_highest: Optional[ColorValue] = NoneA surface container color with the darkest tone. It is used to create the most emphasis against the surface.
surface_container_lowclass-attributeinstance-attribute
surface_container_low: Optional[ColorValue] = NoneA surface container color with a lighter tone that creates less emphasis than surface_container but more emphasis than surface_container_lowest.
surface_container_lowestclass-attributeinstance-attribute
surface_container_lowest: Optional[ColorValue] = NoneA surface container color with the lightest tone and the least emphasis relative to the surface.
surface_dimclass-attributeinstance-attribute
surface_dim: Optional[ColorValue] = NoneA color that's always darkest in the dark or light theme.
surface_tintclass-attributeinstance-attribute
surface_tint: Optional[ColorValue] = NoneA color used as an overlay on a surface color to indicate a component's elevation.
tertiaryclass-attributeinstance-attribute
tertiary: Optional[ColorValue] = NoneA 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.
tertiary_containerclass-attributeinstance-attribute
tertiary_container: Optional[ColorValue] = NoneA color used for elements needing less emphasis than tertiary.
tertiary_fixedclass-attributeinstance-attribute
tertiary_fixed: Optional[ColorValue] = NoneA substitute for tertiary_container that's the same color for dark and light themes.
tertiary_fixed_dimclass-attributeinstance-attribute
tertiary_fixed_dim: Optional[ColorValue] = NoneA color used for elements needing more emphasis than tertiary_fixed.
Events
on_errorclass-attributeinstance-attribute
on_error: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that's clearly legible when drawn on error.
on_error_containerclass-attributeinstance-attribute
on_error_container: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that's clearly legible when drawn on error_container.
on_inverse_surfaceclass-attributeinstance-attribute
on_inverse_surface: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that's clearly legible when drawn on inverse_surface.
on_primaryclass-attributeinstance-attribute
on_primary: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that's clearly legible when drawn on primary.
on_primary_containerclass-attributeinstance-attribute
on_primary_container: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that's clearly legible when drawn on primary_container.
on_primary_fixedclass-attributeinstance-attribute
on_primary_fixed: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that is used for text and icons that exist on top of elements having primary_fixed color.
on_primary_fixed_variantclass-attributeinstance-attribute
on_primary_fixed_variant: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that provides a lower-emphasis option for text and icons than on_primary_fixed.
on_secondaryclass-attributeinstance-attribute
on_secondary: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that's clearly legible when drawn on secondary.
on_secondary_containerclass-attributeinstance-attribute
on_secondary_container: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that's clearly legible when drawn on secondary_container.
on_secondary_fixedclass-attributeinstance-attribute
on_secondary_fixed: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that is used for text and icons that exist on top of elements having secondary_fixed color.
on_secondary_fixed_variantclass-attributeinstance-attribute
on_secondary_fixed_variant: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that provides a lower-emphasis option for text and icons than on_secondary_fixed.
on_surfaceclass-attributeinstance-attribute
on_surface: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that's clearly legible when drawn on surface.
on_surface_variantclass-attributeinstance-attribute
on_surface_variant: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that's clearly legible when drawn on surface_container_highest.
on_tertiaryclass-attributeinstance-attribute
on_tertiary: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that's clearly legible when drawn on tertiary.
on_tertiary_containerclass-attributeinstance-attribute
on_tertiary_container: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that's clearly legible when drawn on tertiary_container.
on_tertiary_fixedclass-attributeinstance-attribute
on_tertiary_fixed: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that is used for text and icons that exist on top of elements having tertiary_fixed color.
on_tertiary_fixed_variantclass-attributeinstance-attribute
on_tertiary_fixed_variant: Optional[ColorValue] = field(default=None, metadata={'event': False})A color that provides a lower-emphasis option for text and icons than on_tertiary_fixed.