Skip to main content

Theme YAML

In your Rill project directory, create a <theme_name>.yaml file in any directory containing type: theme. Rill will automatically ingest the theme next time you run rill start or deploy to Rill Cloud.

To apply that theme to a dashboard, add default_theme: <name of theme> to the yaml file for that dashboard. Alternatively, you can add this to the end of the URL in your browser: ?theme=<name of theme>

Properties

type

[string] - Refers to the resource type and must be theme (required)

colors

[object] - Used to override the dashboard colors. Either primary or secondary color must be provided. (required)

  • primary - [string] - Overrides the primary blue color in the dashboard. Can have any hex (without the '#' character), named colors or hsl() formats. Note that the hue of the input colors is used for variants but the saturation and lightness is copied over from the blue color palette.

  • secondary - [string] - Overrides the secondary color in the dashboard. Applies to the loading spinner only as of now. Can have any hex (without the '#' character), named colors or hsl() formats.

Common Properties

name

[string] - Name is usually inferred from the filename, but can be specified manually.

refs

[array of string] - List of resource references

dev

[object] - Overrides any properties in development environment.

prod

[object] - Overrides any properties in production environment.

Examples

# Example: You can copy this directly into your <theme_name>.yaml file
type: theme
colors:
primary: plum
secondary: violet