---
whiskers:
    version: "2.0.0"
---
## Demo

**flavor:** {{ flavor.name }}

### Colours
{% set lightred = red | add(lightness=10) -%}
{% set darkred = red | sub(lightness=10) -%}
{% set palered = red | mix(color=base, amount=0.3) -%}
{% set fadered1 = red | mod(opacity=0.6) -%}
{% set fadered2 = red | mod(opacity=0.5) -%}

- **red:**                #{{ red.hex }} / {{ css_rgb(color=red) }} / {{ css_hsl(color=red) }}
- **components:**         r: {{ red.rgb.r }} / {{ red.rgb.r / 255 | trunc(places=2) }}, g: {{ red.rgb.g }} / {{ red.rgb.g / 255 | trunc(places=2) }}, b: {{ red.rgb.b }} / {{ red.rgb.b / 255 | trunc(places=2) }}
- **alpha:**              {{ fadered1.opacity }} / {{ fadered1.opacity / 255 | trunc(places=2) }}
- **10% lighter:**        #{{ lightred.hex }} / {{ css_rgb(color=lightred) }} / {{ css_hsl(color=lightred) }}
- **10% darker:**         #{{ darkred.hex }} / {{ css_rgb(color=darkred) }} / {{ css_hsl(color=darkred) }}

- **30% mix with base:**  #{{ palered.hex }} / {{ css_rgb(color=palered) }} / {{ css_hsl(color=palered) }}

- **50% opacity:**        #{{ fadered2.hex }} / {{ css_rgba(color=fadered2) }} / {{ css_hsla(color=fadered2) }}

### Conditionals

this is a {{ if(cond=flavor.dark, t="dark", f="light") }} theme