Keyboard shortcuts

Press ← or → to navigate between chapters

Press S or / to search in the book

Press ? to show this help

Press Esc to hide this help

themes/default.json — file map

Fonts, colours, dialogue-box presets, menus, and control chrome for the whole game. Most games start from an example themes/default.json and change colours and sizes. Choice and text-input packs are separate files under themes/ — see the Look pages. Extra root objects (or themes/<name>.json) are named button packs with the same keys as buttons.

The whole file

Keys with { … } open below. Linked names jump to that section. Grey notes say what each key does. Under each section, Keys lists type, If omitted, allowed values, and a short note.

{
  "typography": { … },       // fonts and sizes
  "colors": { … },           // fallback text and empty-stage colours
  "panel": { … },            // named dialogue-box presets — any names you choose
  "labelplate": { … },       // named name-plate styles
  "buttons": { … },          // default menu / screen button chrome
  "scrollbar": { … },        // menus and panel body scrollbars
  "slider": { … },           // settings volume and similar rows
  "toggle": { … },           // on/off settings controls
  "card": { … },             // content cards on screens
  "separator": { … },        // thin rules between blocks
  "notification": { … },     // toast chrome (Saved, Loaded, …)
  "settings_layout": { … },  // label / control columns on settings screens
  "readonly_styles": { … },  // looks when a panel is readonly / not talking
  "…": { … }                 // named button packs you add — same keys as buttons
}

typography

Fonts and sizes.

{
  "typography": {                // fonts and sizes
    "font": "Jupiteroid",        // base face under fonts/
    "font_menu": null,           // menus and settings
    "font_dialogue": null,       // dialogue and choices
    "font_label": "Jupiteroid",  // speaker name plate
    "size_scale": 1.0,           // size multiplier
    "sizes": {                   // pixel sizes
      "speaker": 45,             // name plate
      "dialogue": 30,            // body text
      "choice": 30,              // choice captions
      "button": 30,              // menu buttons
      "notification": 30         // toasts
    }
  }
}

Keys

font string
If omitted player default font
Stem under fonts/ (variants -Regular / -Bold when present).
font_menu string
If omitted use font
Menus / settings buttons. null or omit → font.
font_dialogue string
If omitted use font
Dialogue body and choice captions. null or omit → font.
font_label string
If omitted use font
Name-plate face.
size_scale number
If omitted 1.0
Multiplies all sizes.*. Player text-size builds on this.
sizes.speaker number
If omitted engine fallback
Speaker name size.
sizes.dialogue number
If omitted engine fallback
Dialogue body size.
sizes.choice number
If omitted engine fallback
Choice button captions.
sizes.button number
If omitted 20
Screen / menu button captions.
sizes.notification number
If omitted engine fallback
Notification toast text.

Learn more: typography

colors

Fallback text and empty-stage colours.

{
  "colors": {                         // fallback text and empty-stage colours
    "background_default": "#dfdcd7",  // empty stage fill
    "speaker_text": "#c4693a",        // name plate text
    "dialogue_text": "#e8e5e0",       // body text
    "choice_text": "#c5cad5",         // choice captions
    "notification_text": "#dfdcd7"    // toast text
  }
}

Keys

background_default color
If omitted #1e2347
Fill when no background picture is up.
speaker_text color
If omitted #b3bfe6
Speaker name fallback.
dialogue_text color
If omitted #ffffff
Dialogue body fallback.
choice_text color
If omitted #c8d0ff
Choice caption fallback.
notification_text color
If omitted #e6f0ff
Toast / some heading fallbacks.

Learn more: colors

panel

Named dialogue-box presets — any names you choose.

{
  "panel": {                                  // named dialogue-box presets — any names you choose
    "default": {                              // any name you choose
      "extends": "default",                   // inherit another preset
      "width": "80%",                         // panel width
      "anchor_h": "center",                   // horizontal place
      "anchor_v": "bottom",                   // vertical place
      "offset_x": 0,                          // nudge X
      "offset_y": -32,                        // nudge Y
      "min_height": 160,                      // height floor
      "max_height": "50%",                    // height ceiling
      "padding": {"top": 15, "left": 20, "right": 20, "bottom": 20},  // inner margins
      "speaker_gap": 6,                       // name to text gap
      "choices_gap": 2,                       // text to choices gap
      "choices_separation": 4,                // between choices
      "bg": "#343a52e0",                      // flat plate colour
      "bg_texture": "sprites/panel-bg.png",   // plate image
      "bg_9slice": [15, 15, 15, 15],          // nine-slice margins
      "corner_radius": 0,                     // flat corner radius
      "resize_duration": 0,                   // height ease
      "scrollbar_layout": "default",          // body scrollbar column
      "typography": {"font": "JetBrainsMono", "sizes": {"dialogue": 18, "choice": 18}},  // panel font / sizes overlay
      "colors": {"dialogue_text": "#c8ffd0", "speaker_text": "#7CFF8A"},  // panel body / speaker colours
      "labelplate_style_key": "default",      // name plate style
      "labelplate_layout": {"anchor_h": "left", "anchor_v": "top", "offset_y": -47},  // docked name plate
      "continue_button": {"visible": true},   // next / continue control
      "back_button": {"visible": false},      // back control
      "slots": [],                            // avatar / art slots
      "default_plate": "them",                // fallback plate name
      "plates": {                             // named per-beat plates for text_mode plates
        "them": {                             // any name you choose
          "extends": "them",                  // inherit another plate
          "anchor_h": "left",                 // side of text column
          "width": "88%",                     // plate width
          "speaker": "on_change",             // in-plate speaker header
          "speaker_gap": 4,                   // header to body gap
          "bg": "#2b3552",                    // flat plate colour
          "corner_radius": 14,                // flat corner radius
          "bg_texture": "sprites/plate-bg.png",  // plate image
          "bg_9slice": [12, 12, 12, 12],      // nine-slice margins
          "shader": {"name": "drop_shadow", "target": "bg"},  // background shader
          "padding": {"top": 8, "left": 12, "right": 12, "bottom": 8},  // inner margins
          "margin": {"top": 3, "bottom": 3, "left": 0, "right": 0},  // outer spacing
          "group_gap": 6,                     // extra gap on speaker change
          "typography": {"sizes": {"speaker": 13}},  // plate font / sizes overlay
          "colors": {"dialogue_text": "#e8ecff", "speaker_text": "#8aa0c8"},  // plate body / speaker colours
          "transition_in": "slide_right",     // live plate enter
          "transition_out": "fade",           // validated; unused on fold
          "transition_duration": 0.22,        // enter duration
          "transition": "fade",               // enter fallback
          "duration": 0.22                    // duration alias
        }
      }
    }
  }
}

Keys

extends string
If omitted no parent
Merge another preset first, then apply this one's keys.
width string
If omitted 100%
"NN%", "100%", "stretch", or a pixel number.
anchor_h enum
If omitted stretch
Values left · center · right · stretch
Where the plate sits horizontally.
anchor_v enum
If omitted bottom
Values top · center · bottom · stretch
Where the plate sits vertically.
offset_x number
If omitted 0
Pixels from the horizontal anchor.
offset_y number
If omitted 0
Pixels from the vertical anchor (negative moves up from bottom).
min_height number
If omitted 160
Number, "NN%", or "full".
max_height number
If omitted legacy formula
Overflow scrolls the body. Number, "NN%", or "full".
padding object
If omitted 15 / 20 / 20 / 20
top / left / right / bottom pixels.
speaker_gap number
If omitted 6
Gap between speaker name and body.
choices_gap number
If omitted 2
Gap between body and choice list.
choices_separation number
If omitted 4
Gap between choice rows.
bg color
If omitted #343a52e0
Used when no usable bg_texture.
bg_texture path
If omitted flat bg only
Nine-slice plate image.
bg_9slice array
If omitted [0,0,0,0]
[left, top, right, bottom] for bg_texture.
corner_radius number
If omitted 0
Ignored once a texture is used.
resize_duration number
If omitted 0
Values seconds
Seconds to ease plate height when content grows/shrinks. 0 snaps.
scrollbar_layout enum
If omitted default
Values default · reserve · overlay
reserve keeps wrap width stable on scrolling plates.
typography object
If omitted project typography
Allowlisted overlay onto project typography for body, labelplate, panel-hosted choices and input. Keys: font, font_dialogue, font_label, sizes.speaker/dialogue/choice. Not size_scale / font_menu / button / notification.
colors object
If omitted project colors
Allowlisted overlay onto project colors: dialogue_text, speaker_text only. Choice packs own caption colours; notifications stay global.
labelplate_style_key string
If omitted labelplate.default
Which labelplate.<name> styles the speaker.
labelplate_layout object
If omitted inline above text
Present → dock to panel edge instead of inline.
continue_button object
If omitted shown with defaults
Visibility, label, placement, and button style.
back_button object
If omitted hidden
Same shape as continue_button.
slots array
If omitted none
Panel slots (e.g. talking art). See panels guide.
If omitted none
Which plates.<name> to use when the beat does not pick one. Must name a key in plates.
plates.*.extends string
If omitted no parent
Merge another plate in the same preset first.
plates.*.anchor_h enum
If omitted left
Values left · center · right · stretch
Where the plate sits in the body column.
plates.*.width string
If omitted 80%
"NN%" of the text column, a pixel number, or "stretch".
plates.*.speaker enum
If omitted false
Values false · true · on_change
on_change shows the header when the speaker changes.
plates.*.speaker_gap number
If omitted panel speaker_gap
Gap under the in-plate speaker header. Omit to inherit the preset.
plates.*.bg color
If omitted transparent
Used when no usable bg_texture.
plates.*.corner_radius number
If omitted 0
Ignored once a texture is used.
plates.*.bg_texture path
If omitted flat bg only
Nine-slice plate image.
plates.*.bg_9slice array
If omitted [0,0,0,0]
[left, top, right, bottom] for bg_texture.
plates.*.shader object
If omitted none
target: "bg" only on plates.
plates.*.padding object
If omitted 8 / 12 / 12 / 8
top / left / right / bottom pixels.
plates.*.margin object
If omitted 3 / 3 / 0 / 0
Space around the plate in the column.
plates.*.group_gap number
If omitted 0
Extra space when the speaker changes between beats.
plates.*.typography object
If omitted preset / project
Same allowlist as the panel preset overlay.
plates.*.colors object
If omitted preset / project
Same allowlist as the panel preset overlay.
plates.*.transition_in enum
If omitted instant
Values instant · fade · slide_up · slide_down · slide_left · slide_right
How the live plate chrome enters on a new beat. Motion is clipped to the body scroll. slide_right enters from the left; slide_left from the right.
plates.*.transition_out enum
If omitted unused in v1
Values instant · fade · slide_up · slide_down · slide_left · slide_right
Accepted when present; fold commits plates instantly (no exit tween in v1).
plates.*.transition_duration number
If omitted 0
Values seconds
Seconds for transition_in. 0 or instant = no motion.
plates.*.transition enum
If omitted use transition_in
Values instant · fade · slide_up · slide_down · slide_left · slide_right
Used when transition_in is omitted.
plates.*.duration number
If omitted use transition_duration
Values seconds
Same as transition_duration when that key is absent.

Learn more: panel

labelplate

Named name-plate styles.

{
  "labelplate": {                            // named name-plate styles
    "default": {                             // any name you choose
      "bg_texture": "sprites/label-bg.png",  // plate image
      "bg_9slice": [7, 7, 7, 17],            // nine-slice margins
      "padding_left": 12,                    // inner left
      "padding_right": 12,                   // inner right
      "padding_top": 2,                      // inner top
      "padding_bottom": 12,                  // inner bottom
      "font_color": "#3a2a1a"                // name colour
    }
  }
}

Keys

bg_texture path
If omitted flat colour / none
Nine-slice background for the name.
bg_9slice array
If omitted [0,0,0,0]
Margins for bg_texture.
padding_left number
If omitted 0
Content margin.
padding_right number
If omitted 0
Content margin.
padding_top number
If omitted 0
Content margin.
padding_bottom number
If omitted 0
Content margin.
font_color color
If omitted colors.speaker_text
Overrides colors.speaker_text for this style.

Learn more: labelplate

buttons

Default menu / screen button chrome.

{
  "buttons": {                                // default menu / screen button chrome
    "spacing": 12,                            // menu separation
    "min_width": 220,                         // minimum width
    "corner_radius": 0,                       // corner radius
    "border_width": 0,                        // border width
    "padding_left": 18,                       // padding left
    "padding_right": 18,                      // padding right
    "padding_top": 4,                         // padding top
    "padding_bottom": 6,                      // padding bottom
    "normal_bg": "#d8c9a8",                   // normal fill
    "hover_bg": "#e4d6b4",                    // hover fill
    "pressed_bg": "#c4b48e",                  // pressed fill
    "font_color": "#3a2a1a",                  // label colour
    "font_hover_color": "#6b4420",            // hover label
    "font_pressed_color": "#8a5a28",          // pressed label
    "normal_texture": "sprites/button-normal.png",  // idle image
    "hover_texture": "sprites/button-hover.png",  // hover image
    "pressed_texture": "sprites/button-down.png"  // pressed image
  }
}

Keys

spacing number
If omitted engine fallback
Gap between stacked menu buttons.
min_width number
If omitted 0
Minimum width when greater than 0.
corner_radius number
If omitted 0
Flat plate corner radius.
border_width number
If omitted 0
Flat border width.
padding_left number
If omitted 0
Content margin.
padding_right number
If omitted 0
Content margin.
padding_top number
If omitted 0
Content margin.
padding_bottom number
If omitted 0
Content margin.
normal_bg color
If omitted engine grey
Flat fill for the idle state.
hover_bg color
If omitted engine grey
Flat fill on hover.
pressed_bg color
If omitted engine grey
Flat fill while pressed.
font_color color
If omitted theme default
Idle caption colour.
font_hover_color color
If omitted font_color
Caption on hover.
font_pressed_color color
If omitted font_color
Caption while pressed.
normal_texture path
If omitted flat colours
Texture for the idle state.
hover_texture path
If omitted flat colours
Texture on hover.
pressed_texture path
If omitted flat colours
Texture while pressed.

Learn more: buttons

scrollbar

Menus and panel body scrollbars.

{
  "scrollbar": {                         // menus and panel body scrollbars
    "width": 10,                         // bar width
    "corner_radius": 4,                  // corner radius
    "content_separation": 18,            // gap from content
    "track_color": "#8a6a4a40",          // track colour
    "grabber_color": "#6b4420",          // grabber
    "grabber_hover_color": "#8a5a28",    // grabber hover
    "grabber_pressed_color": "#3a2a1a",  // grabber pressed
    "track_9slice": [0, 0, 0, 0],        // track nine-slice
    "grabber_9slice": [0, 0, 0, 0]       // grabber nine-slice
  }
}

Keys

width number
If omitted 10
Scrollbar thickness.
corner_radius number
If omitted 4
Track / grabber radius.
content_separation number
If omitted caller fallback
Space between scrollable content and the bar.
track_color color
If omitted #4a559060
Track fill.
grabber_color color
If omitted #5b6a82
Thumb colour.
grabber_hover_color color
If omitted #6a75b0
Thumb on hover.
grabber_pressed_color color
If omitted #a8b8ef
Thumb while dragged.
track_9slice array
If omitted [0,0,0,0]
Margins when a track texture is set.
grabber_9slice array
If omitted [0,0,0,0]
Margins when a grabber texture is set.

Learn more: scrollbar

slider

Settings volume and similar rows.

{
  "slider": {                                 // settings volume and similar rows
    "track_height": 9,                        // track height
    "corner_radius": 4,                       // corner radius
    "grabber_size": 19,                       // knob size
    "track_color": "#4a559060",               // track colour
    "fill_color": "#c4693a90",                // filled track
    "fill_hover_color": "#d4794ab0",          // fill hover
    "grabber_color": "#c5cad5",               // knob colour
    "grabber_hover_color": "#dfdcd7",         // knob hover
    "grabber": "sprites/slider-picker.png",   // knob image
    "grabber_hover": "sprites/slider-picker.png",  // knob hover image
    "track_texture": "sprites/slider-bg.png",  // track image
    "fill_texture": "",                       // fill image
    "fill_hover_texture": "",                 // fill hover image
    "track_9slice": [4, 6, 4, 6],             // track nine-slice
    "fill_9slice": [4, 6, 4, 6]               // fill nine-slice
  }
}

Keys

track_height number
If omitted 8
Track thickness.
corner_radius number
If omitted 4
Track / fill radius.
grabber_size number
If omitted 20
Grabber diameter when drawn as a circle.
track_color color
If omitted #4a559060
Empty track fill.
fill_color color
If omitted #c4693a90
Filled portion colour.
fill_hover_color color
If omitted fill_color
Filled portion on hover.
grabber_color color
If omitted #c5cad5
Circle grabber when no texture.
grabber_hover_color color
If omitted #dfdcd7
Circle grabber on hover.
grabber path
If omitted drawn circle
Texture spec for the grabber.
grabber_hover path
If omitted grabber
Texture spec on hover.
track_texture path
If omitted flat track_color
Optional track texture.
fill_texture path
If omitted flat fill_color
Optional fill texture.
fill_hover_texture path
If omitted fill_texture / flat
Optional fill texture on hover.
track_9slice array
If omitted [0,0,0,0]
Margins for track_texture.
fill_9slice array
If omitted [0,0,0,0]
Margins for fill_texture.

Learn more: slider

toggle

On/off settings controls.

{
  "toggle": {                                 // on/off settings controls
    "checked": "sprites/checked.png",         // on image
    "unchecked": "sprites/unchecked.png",     // off image
    "checked_hovered": "sprites/checked.png",  // on hover image
    "unchecked_hovered": "sprites/unchecked.png",  // off hover image
    "icon_size": 0,                           // icon size
    "track_width": 48,                        // switch width
    "track_height": 26,                       // switch height
    "knob_size": 20,                          // knob size
    "corner_radius": 13,                      // track radius
    "track_on_color": "#c4693a90",            // on track
    "track_off_color": "#4a559060",           // off track
    "knob_color": "#dfdcd7",                  // switch knob
    "knob_hover_color": "#dfdcd7",            // knob hover
    "track_on_hover_color": "#d4794acc",      // on track hover
    "track_off_hover_color": "#6a75a8a0"      // off track hover
  }
}

Keys

checked path
If omitted drawn switch
Texture when on (checkbox mode).
unchecked path
If omitted drawn switch
Texture when off.
checked_hovered path
If omitted checked
On texture while hovered.
unchecked_hovered path
If omitted unchecked
Off texture while hovered.
icon_size number
If omitted 0
Force icon size; 0 uses the texture size.
track_width number
If omitted 48
Drawn switch track width.
track_height number
If omitted 26
Drawn switch track height.
knob_size number
If omitted 20
Drawn switch knob size.
corner_radius number
If omitted 13
Drawn switch corner radius.
track_on_color color
If omitted #c4693a90
Track colour when on.
track_off_color color
If omitted #4a559060
Track colour when off.
knob_color color
If omitted #dfdcd7
Drawn switch knob colour.
knob_hover_color color
If omitted knob_color
Drawn switch knob on hover.
track_on_hover_color color
If omitted track_on_color
On track colour while hovered.
track_off_hover_color color
If omitted track_off_color
Off track colour while hovered.

Learn more: toggle

card

Content cards on screens.

{
  "card": {                                 // content cards on screens
    "max_width": 520,                       // card width cap
    "padding_left": 36,                     // padding left
    "padding_right": 36,                    // padding right
    "padding_top": 28,                      // padding top
    "padding_bottom": 28,                   // padding bottom
    "spacing": 14,                          // inner gap
    "bg": "#dfdcd7e0",                      // card fill
    "corner_radius": 0,                     // corner radius
    "bg_texture": "sprites/screen-bg.png",  // card image
    "bg_9slice": [7, 7, 7, 7]               // nine-slice margins
  }
}

Keys

max_width number
If omitted 500
Maximum card width.
padding_left number
If omitted 40
Inner margin.
padding_right number
If omitted 40
Inner margin.
padding_top number
If omitted 30
Inner margin.
padding_bottom number
If omitted 30
Inner margin.
spacing number
If omitted 20
Separation between card children.
bg color
If omitted #1e234790
Flat card colour.
corner_radius number
If omitted 12
Flat card radius.
bg_texture path
If omitted flat bg
Optional nine-slice background.
bg_9slice array
If omitted [0,0,0,0]
Margins for bg_texture.

Learn more: card

separator

Thin rules between blocks.

{
  "separator": {          // thin rules between blocks
    "height": 2,          // rule thickness
    "color": "#8a6a4a60"  // rule colour
  }
}

Keys

height number
If omitted 2
Separator height in pixels.
color color
If omitted #ffffff60
Separator colour.

Learn more: separator

notification

Toast chrome (Saved, Loaded, …).

{
  "notification": {             // toast chrome (Saved, Loaded, …)
    "bg": "#1e2347cc",          // toast fill
    "bg_texture": "",           // toast image
    "bg_9slice": [0, 0, 0, 0],  // nine-slice margins
    "corner_radius": 10,        // corner radius
    "padding_left": 24,         // padding left
    "padding_right": 24,        // padding right
    "padding_top": 10,          // padding top
    "padding_bottom": 12,       // padding bottom
    "min_width": 0,             // minimum width
    "offset_y": 0,              // vertical nudge
    "fade_in": 0.15,            // fade in
    "fade_out": 0.2             // fade out
  }
}

Keys

bg color
If omitted #1e2347cc
Flat toast colour.
bg_texture path
If omitted flat bg
Optional nine-slice background.
bg_9slice array
If omitted [0,0,0,0]
Margins for bg_texture.
corner_radius number
If omitted 10
Flat toast radius.
padding_left number
If omitted 24
Inner margin.
padding_right number
If omitted 24
Inner margin.
padding_top number
If omitted 10
Inner margin.
padding_bottom number
If omitted 12
Inner margin.
min_width number
If omitted content width
Optional minimum toast width.
offset_y number
If omitted 0
Pixels to shift the toast.
fade_in number
If omitted engine default
Values seconds
Appear fade length.
fade_out number
If omitted engine default
Values seconds
Dismiss fade length.

Learn more: notification

settings_layout

Label / control columns on settings screens.

{
  "settings_layout": {        // label / control columns on settings screens
    "title_font_size": 28,    // section heading size
    "label_min_width": 260,   // label column
    "slider_min_width": 200,  // slider column
    "value_min_width": 60,    // value readout
    "item_spacing": 16        // row gap
  }
}

Keys

title_font_size number
If omitted 28
Heading size inside settings cards.
label_min_width number
If omitted 180
Minimum width for preference labels.
slider_min_width number
If omitted 200
Minimum width for slider controls.
value_min_width number
If omitted 60
Minimum width for value text.
item_spacing number
If omitted 16
Gap inside a labeled row.

Learn more: settings_layout

readonly_styles

Looks when a panel is readonly / not talking.

{
  "readonly_styles": {             // looks when a panel is readonly / not talking
    "default": {                   // any name you choose
      "text_color": "#aaaaaa",     // dimmed body
      "speaker_color": "#888888",  // dimmed name
      "bg_opacity": 0.7,           // plate alpha
      "font_scale": 1.0            // size scale
    }
  }
}

Keys

text_color color
If omitted #ffffff
Dialogue colour in readonly mode.
speaker_color color
If omitted #b3bfe6
Speaker colour in readonly mode.
bg_opacity number
If omitted 1.0
Multiplies panel background alpha.
font_scale number
If omitted 1.0
Scales dialogue font size (about 0.5–2).

Learn more: readonly_styles