diff --git a/doc/material-colors.md b/doc/material-colors.md
new file mode 100644
index 000000000..689eed7ed
--- /dev/null
+++ b/doc/material-colors.md
@@ -0,0 +1,369 @@
+---
+uid: uno.themes.material.colors
+---
+
+# Material Colors and Brushes
+
+## Colors
+| Key                        | LightValue | DarkValue |
+| -------------------------- | ---------- | --------- |
+| PrimaryColor               | #5946D2    | #C7BFFF   |
+| PrimaryInverseColor        | #C8BFFF    | #2A009F   |
+| OnPrimaryColor             | #FFFFFF    | #2A009F   |
+| PrimaryContainerColor      | #E5DEFF    | #4129BA   |
+| OnPrimaryContainerColor    | #170065    | #E4DFFF   |
+| PrimaryVariantDarkColor    | #0021C1    | #4128BA   |
+| PrimaryVariantLightColor   | #9679FF    | #C8BFFF   |
+| SecondaryColor             | #6B4EA2    | #CDC2DC   |
+| OnSecondaryColor           | #FFFFFF    | #332D41   |
+| SecondaryContainerColor    | #EBDDFF    | #433C52   |
+| OnSecondaryContainerColor  | #1F182B    | #EDDFFF   |
+| SecondaryVariantDarkColor  | #3B2574    | #441F8A   |
+| SecondaryVariantLightColor | #9B7BD5    | #EBE6F1   |
+| TertiaryColor              | #0061A4    | #9FCAFF   |
+| OnTertiaryColor            | #FFFFFF    | #003258   |
+| TertiaryContainerColor     | #CFE4FF    | #00497D   |
+| OnTertiaryContainerColor   | #001D36    | #D1E4FF   |
+| ErrorColor                 | #B3261E    | #FFB4AB   |
+| OnErrorColor               | #FFFFFF    | #690005   |
+| ErrorContainerColor        | #F9DEDC    | #93000A   |
+| OnErrorContainerColor      | #410E0B    | #FFDAD6   |
+| BackgroundColor            | #FCFBFF    | #1C1B1F   |
+| OnBackgroundColor          | #1C1B1F    | #E5E1E6   |
+| SurfaceColor               | #FFFFFF    | #302D37   |
+| OnSurfaceColor             | #1C1B1F    | #E6E1E5   |
+| SurfaceVariantColor        | #F2EFF5    | #47464F   |
+| OnSurfaceVariantColor      | #8A8494    | #C9C5D0   |
+| SurfaceInverseColor        | #313033    | #E6E1E5   |
+| OnSurfaceInverseColor      | #F4EFF4    | #1C1B1F   |
+| SurfaceTintColor           | #5946D2    | #C7BFFF   |
+| OutlineColor               | #79747E    | #928F99   |
+| OutlineVariantColor        | #C9C5D0    | #57545D   |
+
+## Opacities
+| Key                | Value |
+| ------------------ | ----- |
+| HoverOpacity       | 0.08  |
+| FocusedOpacity     | 0.12  |
+| PressedOpacity     | 0.12  |
+| DraggedOpacity     | 0.16  |
+| SelectedOpacity    | 0.16  |
+| MediumOpacity      | 0.54  |
+| LowOpacity         | 0.32  |
+| DisabledOpacity    | 0.38  |
+| DisabledLowOpacity | 0.12  |
+
+## Brushes
+| Key                                   | Color                      | Opacity            |
+| ------------------------------------- | -------------------------- | ------------------ |
+| PrimaryBrush                          | PrimaryColor               | 1                  |
+| PrimaryHoverBrush                     | PrimaryColor               | HoverOpacity       |
+| PrimaryFocusedBrush                   | PrimaryColor               | FocusedOpacity     |
+| PrimaryPressedBrush                   | PrimaryColor               | PressedOpacity     |
+| PrimaryDraggedBrush                   | PrimaryColor               | DraggedOpacity     |
+| PrimarySelectedBrush                  | PrimaryColor               | SelectedOpacity    |
+| PrimaryMediumBrush                    | PrimaryColor               | MediumOpacity      |
+| PrimaryLowBrush                       | PrimaryColor               | LowOpacity         |
+| PrimaryDisabledBrush                  | PrimaryColor               | DisabledOpacity    |
+| PrimaryDisabledLowBrush               | PrimaryColor               | DisabledLowOpacity |
+| PrimaryInverseBrush                   | PrimaryInverseColor        | 1                  |
+| PrimaryInverseHoverBrush              | PrimaryInverseColor        | HoverOpacity       |
+| PrimaryInverseFocusedBrush            | PrimaryInverseColor        | FocusedOpacity     |
+| PrimaryInversePressedBrush            | PrimaryInverseColor        | PressedOpacity     |
+| PrimaryInverseDraggedBrush            | PrimaryInverseColor        | DraggedOpacity     |
+| PrimaryInverseSelectedBrush           | PrimaryInverseColor        | SelectedOpacity    |
+| PrimaryInverseMediumBrush             | PrimaryInverseColor        | MediumOpacity      |
+| PrimaryInverseLowBrush                | PrimaryInverseColor        | LowOpacity         |
+| PrimaryInverseDisabledBrush           | PrimaryInverseColor        | DisabledOpacity    |
+| PrimaryInverseDisabledLowBrush        | PrimaryInverseColor        | DisabledLowOpacity |
+| OnPrimaryBrush                        | OnPrimaryColor             | 1                  |
+| OnPrimaryHoverBrush                   | OnPrimaryColor             | HoverOpacity       |
+| OnPrimaryFocusedBrush                 | OnPrimaryColor             | FocusedOpacity     |
+| OnPrimaryPressedBrush                 | OnPrimaryColor             | PressedOpacity     |
+| OnPrimaryDraggedBrush                 | OnPrimaryColor             | DraggedOpacity     |
+| OnPrimarySelectedBrush                | OnPrimaryColor             | SelectedOpacity    |
+| OnPrimaryMediumBrush                  | OnPrimaryColor             | MediumOpacity      |
+| OnPrimaryLowBrush                     | OnPrimaryColor             | LowOpacity         |
+| OnPrimaryDisabledBrush                | OnPrimaryColor             | DisabledOpacity    |
+| OnPrimaryDisabledLowBrush             | OnPrimaryColor             | DisabledLowOpacity |
+| PrimaryContainerBrush                 | PrimaryContainerColor      | 1                  |
+| PrimaryContainerHoverBrush            | PrimaryContainerColor      | HoverOpacity       |
+| PrimaryContainerFocusedBrush          | PrimaryContainerColor      | FocusedOpacity     |
+| PrimaryContainerPressedBrush          | PrimaryContainerColor      | PressedOpacity     |
+| PrimaryContainerDraggedBrush          | PrimaryContainerColor      | DraggedOpacity     |
+| PrimaryContainerSelectedBrush         | PrimaryContainerColor      | SelectedOpacity    |
+| PrimaryContainerMediumBrush           | PrimaryContainerColor      | MediumOpacity      |
+| PrimaryContainerLowBrush              | PrimaryContainerColor      | LowOpacity         |
+| PrimaryContainerDisabledBrush         | PrimaryContainerColor      | DisabledOpacity    |
+| PrimaryContainerDisabledLowBrush      | PrimaryContainerColor      | DisabledLowOpacity |
+| OnPrimaryContainerBrush               | OnPrimaryContainerColor    | 1                  |
+| OnPrimaryContainerHoverBrush          | OnPrimaryContainerColor    | HoverOpacity       |
+| OnPrimaryContainerFocusedBrush        | OnPrimaryContainerColor    | FocusedOpacity     |
+| OnPrimaryContainerPressedBrush        | OnPrimaryContainerColor    | PressedOpacity     |
+| OnPrimaryContainerDraggedBrush        | OnPrimaryContainerColor    | DraggedOpacity     |
+| OnPrimaryContainerSelectedBrush       | OnPrimaryContainerColor    | SelectedOpacity    |
+| OnPrimaryContainerMediumBrush         | OnPrimaryContainerColor    | MediumOpacity      |
+| OnPrimaryContainerLowBrush            | OnPrimaryContainerColor    | LowOpacity         |
+| OnPrimaryContainerDisabledBrush       | OnPrimaryContainerColor    | DisabledOpacity    |
+| OnPrimaryContainerDisabledLowBrush    | OnPrimaryContainerColor    | DisabledLowOpacity |
+| PrimaryVariantLightBrush              | PrimaryVariantLightColor   | 1                  |
+| PrimaryVariantLightHoverBrush         | PrimaryVariantLightColor   | HoverOpacity       |
+| PrimaryVariantLightFocusedBrush       | PrimaryVariantLightColor   | FocusedOpacity     |
+| PrimaryVariantLightPressedBrush       | PrimaryVariantLightColor   | PressedOpacity     |
+| PrimaryVariantLightDraggedBrush       | PrimaryVariantLightColor   | DraggedOpacity     |
+| PrimaryVariantLightSelectedBrush      | PrimaryVariantLightColor   | SelectedOpacity    |
+| PrimaryVariantLightMediumBrush        | PrimaryVariantLightColor   | MediumOpacity      |
+| PrimaryVariantLightLowBrush           | PrimaryVariantLightColor   | LowOpacity         |
+| PrimaryVariantLightDisabledBrush      | PrimaryVariantLightColor   | DisabledOpacity    |
+| PrimaryVariantLightDisabledLowBrush   | PrimaryVariantLightColor   | DisabledLowOpacity |
+| PrimaryVariantDarkBrush               | PrimaryVariantDarkColor    | 1                  |
+| PrimaryVariantDarkHoverBrush          | PrimaryVariantDarkColor    | HoverOpacity       |
+| PrimaryVariantDarkFocusedBrush        | PrimaryVariantDarkColor    | FocusedOpacity     |
+| PrimaryVariantDarkPressedBrush        | PrimaryVariantDarkColor    | PressedOpacity     |
+| PrimaryVariantDarkDraggedBrush        | PrimaryVariantDarkColor    | DraggedOpacity     |
+| PrimaryVariantDarkSelectedBrush       | PrimaryVariantDarkColor    | SelectedOpacity    |
+| PrimaryVariantDarkMediumBrush         | PrimaryVariantDarkColor    | MediumOpacity      |
+| PrimaryVariantDarkLowBrush            | PrimaryVariantDarkColor    | LowOpacity         |
+| PrimaryVariantDarkDisabledBrush       | PrimaryVariantDarkColor    | DisabledOpacity    |
+| PrimaryVariantDarkDisabledLowBrush    | PrimaryVariantDarkColor    | DisabledLowOpacity |
+| SecondaryBrush                        | SecondaryColor             | 1                  |
+| SecondaryHoverBrush                   | SecondaryColor             | HoverOpacity       |
+| SecondaryFocusedBrush                 | SecondaryColor             | FocusedOpacity     |
+| SecondaryPressedBrush                 | SecondaryColor             | PressedOpacity     |
+| SecondaryDraggedBrush                 | SecondaryColor             | DraggedOpacity     |
+| SecondarySelectedBrush                | SecondaryColor             | SelectedOpacity    |
+| SecondaryMediumBrush                  | SecondaryColor             | MediumOpacity      |
+| SecondaryLowBrush                     | SecondaryColor             | LowOpacity         |
+| SecondaryDisabledBrush                | SecondaryColor             | DisabledOpacity    |
+| SecondaryDisabledLowBrush             | SecondaryColor             | DisabledLowOpacity |
+| OnSecondaryBrush                      | OnSecondaryColor           | 1                  |
+| OnSecondaryHoverBrush                 | OnSecondaryColor           | HoverOpacity       |
+| OnSecondaryFocusedBrush               | OnSecondaryColor           | FocusedOpacity     |
+| OnSecondaryPressedBrush               | OnSecondaryColor           | PressedOpacity     |
+| OnSecondaryDraggedBrush               | OnSecondaryColor           | DraggedOpacity     |
+| OnSecondarySelectedBrush              | OnSecondaryColor           | SelectedOpacity    |
+| OnSecondaryMediumBrush                | OnSecondaryColor           | MediumOpacity      |
+| OnSecondaryLowBrush                   | OnSecondaryColor           | LowOpacity         |
+| OnSecondaryDisabledBrush              | OnSecondaryColor           | DisabledOpacity    |
+| OnSecondaryDisabledLowBrush           | OnSecondaryColor           | DisabledLowOpacity |
+| SecondaryContainerBrush               | SecondaryContainerColor    | 1                  |
+| SecondaryContainerHoverBrush          | SecondaryContainerColor    | HoverOpacity       |
+| SecondaryContainerFocusedBrush        | SecondaryContainerColor    | FocusedOpacity     |
+| SecondaryContainerPressedBrush        | SecondaryContainerColor    | PressedOpacity     |
+| SecondaryContainerDraggedBrush        | SecondaryContainerColor    | DraggedOpacity     |
+| SecondaryContainerSelectedBrush       | SecondaryContainerColor    | SelectedOpacity    |
+| SecondaryContainerMediumBrush         | SecondaryContainerColor    | MediumOpacity      |
+| SecondaryContainerLowBrush            | SecondaryContainerColor    | LowOpacity         |
+| SecondaryContainerDisabledBrush       | SecondaryContainerColor    | DisabledOpacity    |
+| SecondaryContainerDisabledLowBrush    | SecondaryContainerColor    | DisabledLowOpacity |
+| OnSecondaryContainerBrush             | OnSecondaryContainerColor  | 1                  |
+| OnSecondaryContainerHoverBrush        | OnSecondaryContainerColor  | HoverOpacity       |
+| OnSecondaryContainerFocusedBrush      | OnSecondaryContainerColor  | FocusedOpacity     |
+| OnSecondaryContainerPressedBrush      | OnSecondaryContainerColor  | PressedOpacity     |
+| OnSecondaryContainerDraggedBrush      | OnSecondaryContainerColor  | DraggedOpacity     |
+| OnSecondaryContainerSelectedBrush     | OnSecondaryContainerColor  | SelectedOpacity    |
+| OnSecondaryContainerMediumBrush       | OnSecondaryContainerColor  | MediumOpacity      |
+| OnSecondaryContainerLowBrush          | OnSecondaryContainerColor  | LowOpacity         |
+| OnSecondaryContainerDisabledBrush     | OnSecondaryContainerColor  | DisabledOpacity    |
+| OnSecondaryContainerDisabledLowBrush  | OnSecondaryContainerColor  | DisabledLowOpacity |
+| SecondaryVariantLightBrush            | SecondaryVariantLightColor | 1                  |
+| SecondaryVariantLightHoverBrush       | SecondaryVariantLightColor | HoverOpacity       |
+| SecondaryVariantLightFocusedBrush     | SecondaryVariantLightColor | FocusedOpacity     |
+| SecondaryVariantLightPressedBrush     | SecondaryVariantLightColor | PressedOpacity     |
+| SecondaryVariantLightDraggedBrush     | SecondaryVariantLightColor | DraggedOpacity     |
+| SecondaryVariantLightSelectedBrush    | SecondaryVariantLightColor | SelectedOpacity    |
+| SecondaryVariantLightMediumBrush      | SecondaryVariantLightColor | MediumOpacity      |
+| SecondaryVariantLightLowBrush         | SecondaryVariantLightColor | LowOpacity         |
+| SecondaryVariantLightDisabledBrush    | SecondaryVariantLightColor | DisabledOpacity    |
+| SecondaryVariantLightDisabledLowBrush | SecondaryVariantLightColor | DisabledLowOpacity |
+| SecondaryVariantDarkBrush             | SecondaryVariantDarkColor  | 1                  |
+| SecondaryVariantDarkHoverBrush        | SecondaryVariantDarkColor  | HoverOpacity       |
+| SecondaryVariantDarkFocusedBrush      | SecondaryVariantDarkColor  | FocusedOpacity     |
+| SecondaryVariantDarkPressedBrush      | SecondaryVariantDarkColor  | PressedOpacity     |
+| SecondaryVariantDarkDraggedBrush      | SecondaryVariantDarkColor  | DraggedOpacity     |
+| SecondaryVariantDarkSelectedBrush     | SecondaryVariantDarkColor  | SelectedOpacity    |
+| SecondaryVariantDarkMediumBrush       | SecondaryVariantDarkColor  | MediumOpacity      |
+| SecondaryVariantDarkLowBrush          | SecondaryVariantDarkColor  | LowOpacity         |
+| SecondaryVariantDarkDisabledBrush     | SecondaryVariantDarkColor  | DisabledOpacity    |
+| SecondaryVariantDarkDisabledLowBrush  | SecondaryVariantDarkColor  | DisabledLowOpacity |
+| TertiaryBrush                         | TertiaryColor              | 1                  |
+| TertiaryHoverBrush                    | TertiaryColor              | HoverOpacity       |
+| TertiaryFocusedBrush                  | TertiaryColor              | FocusedOpacity     |
+| TertiaryPressedBrush                  | TertiaryColor              | PressedOpacity     |
+| TertiaryDraggedBrush                  | TertiaryColor              | DraggedOpacity     |
+| TertiarySelectedBrush                 | TertiaryColor              | SelectedOpacity    |
+| TertiaryMediumBrush                   | TertiaryColor              | MediumOpacity      |
+| TertiaryLowBrush                      | TertiaryColor              | LowOpacity         |
+| TertiaryDisabledBrush                 | TertiaryColor              | DisabledOpacity    |
+| TertiaryDisabledLowBrush              | TertiaryColor              | DisabledLowOpacity |
+| OnTertiaryBrush                       | OnTertiaryColor            | 1                  |
+| OnTertiaryHoverBrush                  | OnTertiaryColor            | HoverOpacity       |
+| OnTertiaryFocusedBrush                | OnTertiaryColor            | FocusedOpacity     |
+| OnTertiaryPressedBrush                | OnTertiaryColor            | PressedOpacity     |
+| OnTertiaryDraggedBrush                | OnTertiaryColor            | DraggedOpacity     |
+| OnTertiarySelectedBrush               | OnTertiaryColor            | SelectedOpacity    |
+| OnTertiaryMediumBrush                 | OnTertiaryColor            | MediumOpacity      |
+| OnTertiaryLowBrush                    | OnTertiaryColor            | LowOpacity         |
+| OnTertiaryDisabledBrush               | OnTertiaryColor            | DisabledOpacity    |
+| OnTertiaryDisabledLowBrush            | OnTertiaryColor            | DisabledLowOpacity |
+| TertiaryContainerBrush                | TertiaryContainerColor     | 1                  |
+| TertiaryContainerHoverBrush           | TertiaryContainerColor     | HoverOpacity       |
+| TertiaryContainerFocusedBrush         | TertiaryContainerColor     | FocusedOpacity     |
+| TertiaryContainerPressedBrush         | TertiaryContainerColor     | PressedOpacity     |
+| TertiaryContainerDraggedBrush         | TertiaryContainerColor     | DraggedOpacity     |
+| TertiaryContainerSelectedBrush        | TertiaryContainerColor     | SelectedOpacity    |
+| TertiaryContainerMediumBrush          | TertiaryContainerColor     | MediumOpacity      |
+| TertiaryContainerLowBrush             | TertiaryContainerColor     | LowOpacity         |
+| TertiaryContainerDisabledBrush        | TertiaryContainerColor     | DisabledOpacity    |
+| TertiaryContainerDisabledLowBrush     | TertiaryContainerColor     | DisabledLowOpacity |
+| OnTertiaryContainerBrush              | OnTertiaryContainerColor   | 1                  |
+| OnTertiaryContainerHoverBrush         | OnTertiaryContainerColor   | HoverOpacity       |
+| OnTertiaryContainerFocusedBrush       | OnTertiaryContainerColor   | FocusedOpacity     |
+| OnTertiaryContainerPressedBrush       | OnTertiaryContainerColor   | PressedOpacity     |
+| OnTertiaryContainerDraggedBrush       | OnTertiaryContainerColor   | DraggedOpacity     |
+| OnTertiaryContainerSelectedBrush      | OnTertiaryContainerColor   | SelectedOpacity    |
+| OnTertiaryContainerMediumBrush        | OnTertiaryContainerColor   | MediumOpacity      |
+| OnTertiaryContainerLowBrush           | OnTertiaryContainerColor   | LowOpacity         |
+| OnTertiaryContainerDisabledBrush      | OnTertiaryContainerColor   | DisabledOpacity    |
+| OnTertiaryContainerDisabledLowBrush   | OnTertiaryContainerColor   | DisabledLowOpacity |
+| ErrorBrush                            | ErrorColor                 | 1                  |
+| ErrorHoverBrush                       | ErrorColor                 | HoverOpacity       |
+| ErrorFocusedBrush                     | ErrorColor                 | FocusedOpacity     |
+| ErrorPressedBrush                     | ErrorColor                 | PressedOpacity     |
+| ErrorDraggedBrush                     | ErrorColor                 | DraggedOpacity     |
+| ErrorSelectedBrush                    | ErrorColor                 | SelectedOpacity    |
+| ErrorMediumBrush                      | ErrorColor                 | MediumOpacity      |
+| ErrorLowBrush                         | ErrorColor                 | LowOpacity         |
+| ErrorDisabledBrush                    | ErrorColor                 | DisabledOpacity    |
+| ErrorDisabledLowBrush                 | ErrorColor                 | DisabledLowOpacity |
+| OnErrorBrush                          | OnErrorColor               | 1                  |
+| OnErrorHoverBrush                     | OnErrorColor               | HoverOpacity       |
+| OnErrorFocusedBrush                   | OnErrorColor               | FocusedOpacity     |
+| OnErrorPressedBrush                   | OnErrorColor               | PressedOpacity     |
+| OnErrorDraggedBrush                   | OnErrorColor               | DraggedOpacity     |
+| OnErrorSelectedBrush                  | OnErrorColor               | SelectedOpacity    |
+| OnErrorMediumBrush                    | OnErrorColor               | MediumOpacity      |
+| OnErrorLowBrush                       | OnErrorColor               | LowOpacity         |
+| OnErrorDisabledBrush                  | OnErrorColor               | DisabledOpacity    |
+| OnErrorDisabledLowBrush               | OnErrorColor               | DisabledLowOpacity |
+| ErrorContainerBrush                   | ErrorContainerColor        | 1                  |
+| ErrorContainerHoverBrush              | ErrorContainerColor        | HoverOpacity       |
+| ErrorContainerFocusedBrush            | ErrorContainerColor        | FocusedOpacity     |
+| ErrorContainerPressedBrush            | ErrorContainerColor        | PressedOpacity     |
+| ErrorContainerDraggedBrush            | ErrorContainerColor        | DraggedOpacity     |
+| ErrorContainerSelectedBrush           | ErrorContainerColor        | SelectedOpacity    |
+| ErrorContainerMediumBrush             | ErrorContainerColor        | MediumOpacity      |
+| ErrorContainerLowBrush                | ErrorContainerColor        | LowOpacity         |
+| ErrorContainerDisabledBrush           | ErrorContainerColor        | DisabledOpacity    |
+| ErrorContainerDisabledLowBrush        | ErrorContainerColor        | DisabledLowOpacity |
+| OnErrorContainerBrush                 | OnErrorContainerColor      | 1                  |
+| OnErrorContainerHoverBrush            | OnErrorContainerColor      | HoverOpacity       |
+| OnErrorContainerFocusedBrush          | OnErrorContainerColor      | FocusedOpacity     |
+| OnErrorContainerPressedBrush          | OnErrorContainerColor      | PressedOpacity     |
+| OnErrorContainerDraggedBrush          | OnErrorContainerColor      | DraggedOpacity     |
+| OnErrorContainerSelectedBrush         | OnErrorContainerColor      | SelectedOpacity    |
+| OnErrorContainerMediumBrush           | OnErrorContainerColor      | MediumOpacity      |
+| OnErrorContainerLowBrush              | OnErrorContainerColor      | LowOpacity         |
+| OnErrorContainerDisabledBrush         | OnErrorContainerColor      | DisabledOpacity    |
+| OnErrorContainerDisabledLowBrush      | OnErrorContainerColor      | DisabledLowOpacity |
+| BackgroundBrush                       | BackgroundColor            | 1                  |
+| BackgroundHoverBrush                  | BackgroundColor            | HoverOpacity       |
+| BackgroundFocusedBrush                | BackgroundColor            | FocusedOpacity     |
+| BackgroundPressedBrush                | BackgroundColor            | PressedOpacity     |
+| BackgroundDraggedBrush                | BackgroundColor            | DraggedOpacity     |
+| BackgroundSelectedBrush               | BackgroundColor            | SelectedOpacity    |
+| BackgroundMediumBrush                 | BackgroundColor            | MediumOpacity      |
+| BackgroundLowBrush                    | BackgroundColor            | LowOpacity         |
+| BackgroundDisabledBrush               | BackgroundColor            | DisabledOpacity    |
+| BackgroundDisabledLowBrush            | BackgroundColor            | DisabledLowOpacity |
+| OnBackgroundBrush                     | OnBackgroundColor          | 1                  |
+| OnBackgroundHoverBrush                | OnBackgroundColor          | HoverOpacity       |
+| OnBackgroundFocusedBrush              | OnBackgroundColor          | FocusedOpacity     |
+| OnBackgroundPressedBrush              | OnBackgroundColor          | PressedOpacity     |
+| OnBackgroundDraggedBrush              | OnBackgroundColor          | DraggedOpacity     |
+| OnBackgroundSelectedBrush             | OnBackgroundColor          | SelectedOpacity    |
+| OnBackgroundMediumBrush               | OnBackgroundColor          | MediumOpacity      |
+| OnBackgroundLowBrush                  | OnBackgroundColor          | LowOpacity         |
+| OnBackgroundDisabledBrush             | OnBackgroundColor          | DisabledOpacity    |
+| OnBackgroundDisabledLowBrush          | OnBackgroundColor          | DisabledLowOpacity |
+| SurfaceBrush                          | SurfaceColor               | 1                  |
+| SurfaceHoverBrush                     | SurfaceColor               | HoverOpacity       |
+| SurfaceFocusedBrush                   | SurfaceColor               | FocusedOpacity     |
+| SurfacePressedBrush                   | SurfaceColor               | PressedOpacity     |
+| SurfaceDraggedBrush                   | SurfaceColor               | DraggedOpacity     |
+| SurfaceSelectedBrush                  | SurfaceColor               | SelectedOpacity    |
+| SurfaceMediumBrush                    | SurfaceColor               | MediumOpacity      |
+| SurfaceLowBrush                       | SurfaceColor               | LowOpacity         |
+| SurfaceDisabledBrush                  | SurfaceColor               | DisabledOpacity    |
+| SurfaceDisabledLowBrush               | SurfaceColor               | DisabledLowOpacity |
+| OnSurfaceBrush                        | OnSurfaceColor             | 1                  |
+| OnSurfaceHoverBrush                   | OnSurfaceColor             | HoverOpacity       |
+| OnSurfaceFocusedBrush                 | OnSurfaceColor             | FocusedOpacity     |
+| OnSurfacePressedBrush                 | OnSurfaceColor             | PressedOpacity     |
+| OnSurfaceDraggedBrush                 | OnSurfaceColor             | DraggedOpacity     |
+| OnSurfaceSelectedBrush                | OnSurfaceColor             | SelectedOpacity    |
+| OnSurfaceMediumBrush                  | OnSurfaceColor             | MediumOpacity      |
+| OnSurfaceLowBrush                     | OnSurfaceColor             | DisabledOpacity    |
+| OnSurfaceDisabledBrush                | OnSurfaceColor             | DisabledOpacity    |
+| OnSurfaceDisabledLowBrush             | OnSurfaceColor             | DisabledLowOpacity |
+| SurfaceVariantBrush                   | SurfaceVariantColor        | 1                  |
+| SurfaceVariantHoverBrush              | SurfaceVariantColor        | HoverOpacity       |
+| SurfaceVariantFocusedBrush            | SurfaceVariantColor        | FocusedOpacity     |
+| SurfaceVariantPressedBrush            | SurfaceVariantColor        | PressedOpacity     |
+| SurfaceVariantDraggedBrush            | SurfaceVariantColor        | DraggedOpacity     |
+| SurfaceVariantSelectedBrush           | SurfaceVariantColor        | SelectedOpacity    |
+| SurfaceVariantMediumBrush             | SurfaceVariantColor        | MediumOpacity      |
+| SurfaceVariantLowBrush                | SurfaceVariantColor        | LowOpacity         |
+| SurfaceVariantDisabledBrush           | SurfaceVariantColor        | DisabledOpacity    |
+| SurfaceVariantDisabledLowBrush        | SurfaceVariantColor        | DisabledLowOpacity |
+| OnSurfaceVariantBrush                 | OnSurfaceVariantColor      | 1                  |
+| OnSurfaceVariantHoverBrush            | OnSurfaceVariantColor      | HoverOpacity       |
+| OnSurfaceVariantFocusedBrush          | OnSurfaceVariantColor      | FocusedOpacity     |
+| OnSurfaceVariantPressedBrush          | OnSurfaceVariantColor      | PressedOpacity     |
+| OnSurfaceVariantDraggedBrush          | OnSurfaceVariantColor      | DraggedOpacity     |
+| OnSurfaceVariantSelectedBrush         | OnSurfaceVariantColor      | SelectedOpacity    |
+| OnSurfaceVariantMediumBrush           | OnSurfaceVariantColor      | MediumOpacity      |
+| OnSurfaceVariantLowBrush              | OnSurfaceVariantColor      | LowOpacity         |
+| OnSurfaceVariantDisabledBrush         | OnSurfaceVariantColor      | DisabledOpacity    |
+| OnSurfaceVariantDisabledLowBrush      | OnSurfaceVariantColor      | DisabledLowOpacity |
+| SurfaceInverseBrush                   | SurfaceInverseColor        | 1                  |
+| SurfaceInverseHoverBrush              | SurfaceInverseColor        | HoverOpacity       |
+| SurfaceInverseFocusedBrush            | SurfaceInverseColor        | FocusedOpacity     |
+| SurfaceInversePressedBrush            | SurfaceInverseColor        | PressedOpacity     |
+| SurfaceInverseDraggedBrush            | SurfaceInverseColor        | DraggedOpacity     |
+| SurfaceInverseSelectedBrush           | SurfaceInverseColor        | SelectedOpacity    |
+| SurfaceInverseMediumBrush             | SurfaceInverseColor        | MediumOpacity      |
+| SurfaceInverseLowBrush                | SurfaceInverseColor        | LowOpacity         |
+| SurfaceInverseDisabledBrush           | SurfaceInverseColor        | DisabledOpacity    |
+| SurfaceInverseDisabledLowBrush        | SurfaceInverseColor        | DisabledLowOpacity |
+| OnSurfaceInverseBrush                 | OnSurfaceInverseColor      | 1                  |
+| OnSurfaceInverseHoverBrush            | OnSurfaceInverseColor      | HoverOpacity       |
+| OnSurfaceInverseFocusedBrush          | OnSurfaceInverseColor      | FocusedOpacity     |
+| OnSurfaceInversePressedBrush          | OnSurfaceInverseColor      | PressedOpacity     |
+| OnSurfaceInverseDraggedBrush          | OnSurfaceInverseColor      | DraggedOpacity     |
+| OnSurfaceInverseSelectedBrush         | OnSurfaceInverseColor      | SelectedOpacity    |
+| OnSurfaceInverseMediumBrush           | OnSurfaceInverseColor      | MediumOpacity      |
+| OnSurfaceInverseLowBrush              | OnSurfaceInverseColor      | LowOpacity         |
+| OnSurfaceInverseDisabledBrush         | OnSurfaceInverseColor      | DisabledOpacity    |
+| OnSurfaceInverseDisabledLowBrush      | OnSurfaceInverseColor      | DisabledLowOpacity |
+| OutlineBrush                          | OutlineColor               | 1                  |
+| OutlineHoverBrush                     | OutlineColor               | HoverOpacity       |
+| OutlineFocusedBrush                   | OutlineColor               | FocusedOpacity     |
+| OutlinePressedBrush                   | OutlineColor               | PressedOpacity     |
+| OutlineDraggedBrush                   | OutlineColor               | DraggedOpacity     |
+| OutlineSelectedBrush                  | OutlineColor               | SelectedOpacity    |
+| OutlineMediumBrush                    | OutlineColor               | MediumOpacity      |
+| OutlineLowBrush                       | OutlineColor               | LowOpacity         |
+| OutlineDisabledBrush                  | OutlineColor               | DisabledOpacity    |
+| OutlineDisabledLowBrush               | OutlineColor               | DisabledLowOpacity |
+| OutlineVariantBrush                   | OutlineVariantColor        | 1                  |
+| OutlineVariantHoverBrush              | OutlineVariantColor        | HoverOpacity       |
+| OutlineVariantFocusedBrush            | OutlineVariantColor        | FocusedOpacity     |
+| OutlineVariantPressedBrush            | OutlineVariantColor        | PressedOpacity     |
+| OutlineVariantDraggedBrush            | OutlineVariantColor        | DraggedOpacity     |
+| OutlineVariantSelectedBrush           | OutlineVariantColor        | SelectedOpacity    |
+| OutlineVariantMediumBrush             | OutlineVariantColor        | MediumOpacity      |
+| OutlineVariantLowBrush                | OutlineVariantColor        | LowOpacity         |
+| OutlineVariantDisabledBrush           | OutlineVariantColor        | DisabledOpacity    |
+| OutlineVariantDisabledLowBrush        | OutlineVariantColor        | DisabledLowOpacity |
+| SurfaceTintBrush                      | SurfaceTintColor           | 1                  |
diff --git a/doc/toc.yml b/doc/toc.yml
index b8f6d0477..16c95f1f5 100644
--- a/doc/toc.yml
+++ b/doc/toc.yml
@@ -28,6 +28,8 @@
   # ***************** Reference\Material *******************
   - name: Material
     items:
+    -name: Material Colors, Opacities and Brushes
+     href: material-colors.md
     - name: Material Control Styles
       href: material-controls-styles.md
     - name: Material Control Extensions