Skip to content

Brush Names

SKProCH edited this page Sep 3, 2023 · 5 revisions

Sometimes you may want to use the brushes from our styles library directly in your Avalonia XAML. Typically you'll use them as dynamic resources, so they will synchronize with the current material palette.

Note
Brush names changed in 3.0.0 version. New and old names listed here.
We also provide a compatibility styles, so your app should work as before.
But you should update you brushes, since old one declared as obsolete and will be removed in 4.0 version.

Palette Brush Names

Primary Color

  • MaterialPrimaryLightBrush
  • MaterialPrimaryLightForegroundBrush
  • MaterialPrimaryMidBrush
  • MaterialPrimaryMidForegroundBrush
  • MaterialPrimaryDarkBrush
  • MaterialPrimaryForegroundBrush

Note
[Light/Mid/Dark]Brush define the different hues of the colour, and the [Light/Mid/Dark]ForegroundBrush define a foreground color which will show up clearly on that hue.

Secondary Color

  • MaterialSecondaryLightBrush
  • MaterialSecondaryLightForegroundBrush
  • MaterialSecondaryMidBrush
  • MaterialSecondaryMidForegroundBrush
  • MaterialSecondaryDarkBrush
  • MaterialSecondaryDarkForegroundBrush

Note
[Light/Mid/Dark]Brush define the different hues of the colour, and the [Light/Mid/Dark]ForegroundBrush define a foreground colour which will show up clearly on that hue.

Example Usage

<TextBlock Foreground="{DynamicResource MaterialPrimaryMidForegroundBrush}" 
    Background="{DynamicResource MaterialPrimaryMidBrush}"/>

Light/Dark Specific Brush Names

Note
For every MaterialNameBrush there is also corresponding MaterialNameColor color defined at resources.

Backgrounds

  • MaterialBackgroundBrush - Absolute black or white background color
  • MaterialPaperBrush - Default background color of window
  • MaterialCardBackgroundBrush - Background color for card in casual cases, lighter than MaterialDesignPaper for more better visibility
  • MaterialToolBarBackgroundBrush - Background color for toolbar
  • MaterialToolTipBackgroundBrush - Background color for tooltips
  • MaterialTextFieldBoxBackgroundBrush - Background color for filled textfield

Foregrounds

  • MaterialBodyBrush - Default foreground color for most widgets
  • MaterialBodyLightBrush - Foreground color but more lighter (alternative foreground color)
  • MaterialColumnHeaderBrush - Foreground color for DataGrid column headers
  • MaterialDividerBrush - Foreground color for separator and DataGrid inner separators

Feedbacks

  • MaterialCheckBoxOffBrush - Color for unchecked checkboxes
  • MaterialCheckBoxDisabledBrush - Color for disabled checkboxes
  • MaterialSelectionBrush - Color for field selection
  • MaterialTextFieldBoxHoverBackgroundBrush - Background color for filled textfield when focused
  • MaterialTextFieldBoxDisabledBackgroundBrush - Background color for filled textfield when disabled

Not used

  • MaterialChipBackgroundBrush - Background color for chip
  • MaterialFlatButtonClickBrush - Color for flat button when click
  • MaterialFlatButtonRippleBrush - Ripple color for flat button
  • MaterialSnackbarBackgroundBrush - Background color for snackbar
  • MaterialSnackbarMouseOverBrush - Cursor over feedback color for snackbar
  • MaterialSnackbarRippleBrush - Ripple color for snackbar

Unknown state

  • MaterialTextBoxBorderBrush
  • MaterialTextAreaBorderBrush
  • MaterialTextAreaInactiveBorderBrush

Material.Avalonia Wiki pages is still WIP (work in progress), Pages could not ready for show if they unclickable.

Main section

Widgets / Controls

Theming

Builders

Assist for widgets

Clone this wiki locally