Creating the theme file

You can create a theme file either by using the editor or by doing it by hand

Editor

  1. Go to the Top bar
  2. Click on Settings
  3. Click on Theme Editor
  4. Manipulate the settings
  5. Optionally: Select a font from Content/
  6. Once you are ready to save, choose the name of the file
  7. The file will be saved under your project's directory's Config/Settings/
  8. Open Config/Settings/Renderer.yaml and type in the name of the config file(excluding file extension)
  9. Load up the editor again

By hand

  1. Create a file with the name of the theme and an extension of .uvktheme

  2. Edit values with every YAML sequence of 4 members being mapped to RGBA, Example:

    textCol: [1.0, 1.0, 1.0, 1.0]
windowBg: [0.1, 0.1, 0.1, 1.0]
header: [0.2, 0.2, 0.2, 1.0]
headerHovered: [0.3, 0.3, 0.3, 1.0]
headerActive: [0.15, 0.15, 0.15, 1.0]
button: [0.2, 0.2, 0.2, 1.0]
buttonHovered: [0.3, 0.3, 0.3, 1.0]
buttonActive: [0.15, 0.15, 0.15, 1.0]
frame: [0.2, 0.2, 0.2, 1.0]
frameHovered: [0.3, 0.3, 0.3, 1.0]
frameActive: [0.15, 0.15, 0.15, 1.0]
tab: [0.15, 0.15, 0.15, 1.0]
tabHovered: [0.4, 0.4, 0.4, 1.0]
tabActive: [0.3, 0.3, 0.3, 1.0]
tabUnfocused: [0.15, 0.15, 0.15, 1.0]
tabUnfocusedActive: [0.2, 0.2, 0.2, 1.0]
titleBg: [0.15, 0.15, 0.15, 1.0]
titleBgCollapsed: [0.95, 0.15, 0.95, 1.0]
titleBgActive: [0.15, 0.15, 0.15, 1.0]
menubarBg: [0.01, 0.01, 0.01, 1.0]
popupBg: [0.1, 0.1, 0.1, 1.0]
font: "jb.ttf"
font-size: 13
window-rounding: 1.0

  3. Optionally: Add a font from your project's Content/ folder

  4. Always have all the fields because not having some may crash the program

  5. Open Config/Settings/Renderer.yaml and type in the name of the config file(excluding file extension)

  6. Reload the editor