Create defold light mode theme

Questions
#1

defold_light_mode
defold_light_mode2790×1532 202 KB 

* {
  -df-background-darker: derive(#f5f5f5, -10%);
  -df-background-dark: derive(#f5f5f5, -5%);
  -df-background: #f5f5f5;
  -df-background-light: derive(#f5f5f5, 10%);
  -df-background-lighter: derive(#f5f5f5, 20%);

  -df-component-darker: derive(#d0d3d6, -20%);
  -df-component-dark: derive(#d0d3d6, -10%);
  -df-component: #d0d3d6;
  -df-component-light: derive(#d0d3d6, 10%);
  -df-component-lighter: derive(#d0d3d6, 20%);

  -df-text-dark: derive(#4a4e54, -10%);
  -df-text: #4a4e54;
  -df-text-selected: derive(#4a4e54, 20%);
}

macOS 14.6.1
Defold 1.9.6

I want to create a Defold light mode theme.
So I followed the link https://defold.com/manuals/editor-styling/ and added the CSS code like the one above into the .defold/editor.css file. However, it didn’t turn into a complete light mode like in the first screenshot.
How can I change the background color of the editor, console and popup window to white?

3 Likes