Themes
A theme is a file that defines Candy Dialogue Creator's look. This page covers writing one; to choose and adjust a theme, see Theme.
There are two kinds of theme file:
| Kind | Description |
| Candy theme (.txt) | Sets the values of the theme settings of Candy Dialogue Creator: its colors, sizes and spacing. The usual choice. |
| Godot theme (.tres, .res, .theme) | A theme built in Godot's theme editor, applied as it is. For a look the theme settings can't express: other fonts, textures, custom shapes. |
- The Themes folder of Candy Dialogue Creator's user folder. Open, on the Settings > Theme page, opens it.
- The Themes folder of a mod (see Mods).
A theme's file name, without its extension, is its id. Use lowercase and underscores: my_theme.txt.
A folder inside a themes folder is a category of the theme dropdown: its name is the category's, with underscores displayed as spaces. Folders inside a category aren't read.
After adding or modifying a file, press Reload on the Settings > Theme page.
The Quick Way
A theme is usually derived from an existing one:
1. Choose the theme closest to the intended look.
2. Adjust its settings on the pages of the Theme category until it looks right.
3. Write those values in a theme file that builds on that theme, as below.
The changes of step 2 are overrides stored in your profile. Written as a theme file, the look can be shared, and used in other profiles.
A Candy Theme
my_theme.txt:
{
"name": "My Theme",
"base": "candy_arts_blue",
"values": {
"background": Color(0.12, 0.13, 0.17, 1),
"surface": Color(0.18, 0.2, 0.26, 1),
"text": Color(0.92, 0.93, 0.95, 1),
"accent": Color(1, 0.55, 0.2, 1),
"corner_radius": 4,
"font_size": 16
}
}
| Key | Description |
| name | The theme's name in the dropdown. |
| base | The id of a theme to build on. Every setting this file doesn't set inherits that theme's value. Without a base, the settings use Candy Dialogue Creator's defaults. |
| values | The theme settings this theme sets, by their id. |
| godot_theme | A Godot theme file laid over the result: beside this file, or a res:// path. |
Color(red, green, blue, alpha), each from 0 to 1. The Color Selector panel writes them: set its mode to 0-1 and its format to Color().
The Main Settings
| Id | Setting |
background | Behind everything, around the panels. |
surface | The inside of panels, widgets, dialogs and menus. |
raised | Boxes. |
field | Text fields and lists. |
control, control_hover, control_pressed | Buttons, and buttons hovered and pressed. |
border | Borders. |
accent | The accent color. |
selection | Selected text and rows. |
text, button_text, muted_text, heading_text | Text, text on buttons, secondary text and titles. |
error_text, warning_text | Errors and warnings. |
font_size | The text size. |
corner_radius, border_width | Rounded corners and border width. |
spacing, padding_h, padding_v | Spacing and padding. |
| Key | Sets |
| navigator_colors | The colors of the Dialogue Navigator's rows: Conversations, Blocks, categories of Commands and single Commands, in each of their states. |
| counter_colors | The colors of the Counters widget's numbers, by state. |
| speech_colors | The text and background colors of the Speech Editors and Viewers left at their default colors, and the color of tag markers. |
"counter_colors": { "words": Color(0.9, 0.9, 0.9, 1), "over_limit": Color(1, 0.3, 0.3, 1) },
"speech_colors": { "text": Color(1, 1, 1, 1), "background": Color(0, 0, 0, 1), "tag_marker": Color(1, 0.55, 0.2, 1) }
navigator_colors is the largest part of most themes. The shortest way to write it: set the colors in Settings > UI > Navigator Colors, save them there with Save / Load, then copy the navigator_colors of the saved file into the theme, since both use the same format (see Navigator Colors). An all entry styles every row at once:
"navigator_colors": {
"all": {
"normal": { "text": Color(0.9, 0.9, 0.9, 1), "bg": Color(0.1, 0.1, 0.1, 1) },
"border_width": { "left": 6, "top": 1, "right": 1, "bottom": 1 }
}
}
A Godot Theme
A Godot theme file placed in a themes folder is listed like any theme, and applied as it is.
It can also be laid over a Candy theme, through the Candy theme's godot_theme key: the Candy theme sets the colors and sizes, and the Godot theme restyles the controls it defines.
Either way, the user's overrides from the Theme settings pages apply on top.
Replacing a Built-In Theme
A theme with the file name of a built-in one replaces it.
