Palette

import SlintProperty from '@slint/common-files/src/components/SlintProperty.astro'; import Link from '@slint/common-files/src/components/Link.astro';

Use Palette to create custom widgets that match the colors of the selected style e.g. fluent, cupertino, material, or qt.

See <Link type="StyleWidgets" label="Widget Styles"/> for details on the available styles.

Properties

background

<SlintProperty propName="background" typeName="brush" propertyVisibility="out"> Defines the default background brush. Use this if none of the more specialized background brushes apply. </SlintProperty>

foreground

<SlintProperty propName="foreground" typeName="brush" propertyVisibility="out"> Defines the foreground brush that is used for content that is displayed on `background` brush. </SlintProperty>

alternate-background

<SlintProperty propName="alternate-background" typeName="brush" propertyVisibility="out"> Defines an alternate background brush that is used for example for text input controls or panels like a side bar. </SlintProperty>

alternate-foreground

<SlintProperty propName="alternate-foreground" typeName="brush" propertyVisibility="out"> Defines the foreground brush that is used for content that is displayed on `alternate-background` brush. </SlintProperty>

control-background

<SlintProperty propName="control-background" typeName="brush" propertyVisibility="out"> Defines the default background brush for controls, such as push buttons, combo boxes, etc. </SlintProperty>

control-foreground

<SlintProperty propName="control-foreground" typeName="brush" propertyVisibility="out"> Defines the foreground brush that is used for content that is displayed on `control-background` brush. </SlintProperty>

accent-background

<SlintProperty propName="accent-background" typeName="brush" propertyVisibility="out"> Defines the background brush for highlighted controls such as primary buttons. </SlintProperty>

accent-foreground

<SlintProperty propName="accent-foreground" typeName="brush" propertyVisibility="out"> Defines the foreground brush that is used for content that is displayed on `accent-background` brush. </SlintProperty>

selection-background

<SlintProperty propName="selection-background" typeName="brush" propertyVisibility="out"> Defines the background brush that is used to highlight a selection such as a text selection. </SlintProperty>

selection-foreground

<SlintProperty propName="selection-foreground" typeName="brush" propertyVisibility="out"> Defines the foreground brush that is used for content that is displayed on `selection-background` brush. </SlintProperty>

border

<SlintProperty propName="border" typeName="brush" propertyVisibility="out"> Defines the brush that is used for borders such as separators and widget borders. </SlintProperty>

color-scheme

<SlintProperty propName="color-scheme" typeName="enum" enumName="ColorScheme" propertyVisibility="in-out"> Read this property to determine the color scheme used by the palette. Set this property to force a dark or light color scheme. All styles except for the Qt style support setting a dark or light color scheme. </SlintProperty>