diff --git a/docs/docs/user-guide/customization/color-schemes.mdx b/docs/docs/user-guide/customization/color-schemes.mdx index be590bb1..7c1dd518 100644 --- a/docs/docs/user-guide/customization/color-schemes.mdx +++ b/docs/docs/user-guide/customization/color-schemes.mdx @@ -41,10 +41,10 @@ For a detailed explanation of the color system, see https://m3.material.io/style ### Key colors -A color scheme is defined by a set of key colors. These key colors are not used by themselves, but +A color scheme is defined by a set of key colors. These key colors are not used on their own, but they are used to generate the rest of the color scheme. The key colors are: -- **Primary**: used for mainly used for interactive key components, like buttons, switches and input +- **Primary**: mainly used for interactive key components, like buttons, switches and input fields. Also used for [themed icons](/docs/user-guide/customization/themed-icons/) and as elevation overlay color (cards, dialogs and other elevated surfaces will have a slight tint of this color) - **Secondary**: used for less prominent components, such as chips, badges and some (non interactive) headlines @@ -81,14 +81,14 @@ To learn how the different scheme colors are used in components, refer to the Examples are shown in the color scheme editor. Keep in mind, that not all scheme colors are currently used by Kvaesitso. -For each scheme color, there is one variant for light mode, and one for dark mode. To toggle between -light and dark mode variants, use the and buttons in the top right corner -of each section. - :::tip Long press a color to display its name. ::: +For each scheme color, there is one variant for light mode, and one for dark mode. To toggle between +light and dark mode variants, use the and buttons in the top right corner +of each section. + For each scheme color, you can either select a custom color, or you can derive a color from a key color. To derive a color from a key color, select **Palette**, and then select the key color -to derive from. You can then adjust the tone of the derived color by dragging the **T** slider. \ No newline at end of file +to derive from. You can then adjust the tone of the derived color by dragging the **T** slider.