Templates
Basic Syntax
| Type | Syntax | Description |
|---|---|---|
| Expression (Keyword) | {{ expression }} |
Evaluates and outputs a value. |
| Block | <* ... *> |
Used for loops, conditionals and includes. |
| Escaping | \{{ ... }} |
Escapes template output so it isn't evaluated. |
Expressions
Use dot notation to access nested values inside context objects.
{{ colors.primary.default.hex }}
{{ palettes.error._99.hex }}
{{ mode }}
Example:
{{ custom.red_color.hex }} -> #ff0000
{{ custom.red_color.rgb }} -> rgb(255, 0, 0)
Includes
Includes another template file, the name should be the template name you put in the config.
If you just want to use the included template inside of another one and don't want to write
it to a file,
you can just comment out the output_path
[templates.includeme]
input_path = "./include.txt"
# The output path is optional if you just want to import the template
# output_path = "./a/include.txt"
Example:
<* include "includeme" *>
Conditionals
Conditionals allow branching logic inside templates.
Negation with the not keyword is supported for any version above v3.1.0
<* if {{ condition }} *>
...content if true...
<* else *>
...content if false...
<* endif *>
If statement
<* if {{ is_dark_mode }} *>
Dark Mode
<* else *>
Light Mode
<* endif *>
If statement using negation
<* if not {{ condition }} *>
...content if false...
<* else *>
...content if true...
<* endif *>
Loops
Range Loop
Iterates over a numeric range (inclusive).
<* for i in -10..10 *>
{{ i }}
<* endfor *>
Key-Value Loop
Iterates through maps or objects, exposing both key and value bindings.
Listing all the MD3 colors
<* for name, value in colors *>
{{ name }}: {{ value.default.hex }};
<* endfor *>
Filters
Filters transform or modify values, they are chained using the pipe symbol
(|).
They can support Expressions as arguments.
Example:
{{ colors.primary.default.hex | lighten: 20.0 | invert }}
<* for i in -10..10 *>
actual: {{ i }} multiplied: {{ {{ i }} * 10 }} {{ colors.red.default.hex | lighten: {{i}} * 10 }}
<* endfor *>
Arithmetic and Nested Expressions
Expressions can be nested or contain arithmetic operations.
{{ {{ i }} * 10 }}
{{ colors.red.default.hex | lighten: {{ i }} * 10 }}
Escaping Output
To render raw {{ ... }} text without evaluating it:
\{{ colors.primary.default.hex }}
This will output literally {{ colors.primary.default.hex }} in
the result.