Theming

Color Palette

wallbash generates a color palette from your wallpaper based on Material Design guidelines. The theming system lets you use these dynamic colors to theme any text-based configuration file on your system.

Important

The palette switches between light/dark based on the brightness of your wallpaper.

Color Roles

Here are the 28 color variables grouped based on its role, that can be used in your application config files. These variables will adapt to colors in HEX format [::...::] → #RRGGBB. For more details on roles and how to use it, please refer material design guide here.

4 Primary Colors

[::Primary::] Main accent color [::On Primary::] Text/icons on primary [::Primary Container::] Primary variant for surfaces [::On Primary Container::] Text on primary container

4 Secondary Colors

[::Secondary::] Secondary accent [::On Secondary::] Text on secondary [::Secondary Container::] Secondary variant [::On Secondary Container::] Text on secondary container

4 Tertiary Colors

[::Tertiary::] Tertiary accent [::On Tertiary::] Text on tertiary [::Tertiary Container::] Tertiary variant [::On Tertiary Container::] Text on tertiary container

4 Error Colors

[::Error::] Error color [::On Error::] Text on error [::Error Container::] Error variant [::On Error Container::] Text on error container

7 Surface Colors

[::Surface::] Main background [::On Surface::] Text/icons on surface [::Surface Variant::] Alternate background [::On Surface Variant::] Text on variant [::Outline::] Borders/dividers [::Outline Variant::] Alternative borders [::Shadow::] Shadow color

2 Background Colors

[::Background::] Background surface [::On Background::] Text on background

3 Inverse Colors

[::Inverse Surface::] Inverted surface [::Inverse On Surface::] Text on inverse surface [::Inverse Primary::] Inverted primary

Color Formats

Each color variable supports alpha values (transparency) in 2 different formats.

HEX Format: use values from 0 to 100 (percentage)

[::Primary::50::] #C6BDFF80 50% opacity [::Primary::85::] #C6BDFFD9 85% opacity

RGBA Format: use values from 0.0 to 1.0 (decimal)

[::Primary::0.5::] rgba(198,189,255,0.50) 50% opacity [::Primary::0.85::] rgba(198,189,255,0.85) 85% opacity