* Tested in GIMP 2.99.16 *

This is not a Script-Fu post, this is about how the GUI appears and how it responds to user input. This is all controlled by a ‘theme’, which is a CSS file that defines what attributes each element of the interface has. I’ve put together a few themes for GIMP 3 and I think they’re ready to try out.
You can find them here.

The themes collection includes:

  • Default - Mid gray based, using the full tonal range, with a dark and light version
  • High Contrast - For easy to see UI features
  • Warm - Toasty, with a dark and light version
  • Dark - For those who like it darker, with a dark and light version

Click the green ‘<> Code’ button and ‘Download ZIP’. Once downloaded, extract the themes directory someplace and point GIMP at the folder by adding it here:
Edit->Preferences->Folders->Themes

Then restart GIMP, you can find the new themes to try out in here:
Edit->Preferences->Interface->Theme

They can be seen in this video…

When selecting a theme in Preferences, GIMP looks in a theme folder for the file called ‘gimp.css’. The base theme ‘gimp.css’ is in the ‘Pixelmixer-Default’ folder. That folder contains the initial set of CSS styles that define the overall look and feel of GIMP 3. It is designed in a modular way, separating different components and sections into distinct CSS rules. This allows derived themes to override specific components or sections easily, without affecting the rest of the layout. Spacing and font sizes are defined relative to the system font-size. This means that you can change the system font size and the GUI will resize to match, you may need to restart GIMP.

Inside the default theme folder are CSS files and assets. Color definitions for the theme are in ‘color-definitions.css’. This has been designed to implement a dark and light version easily. Assets for a theme are in the assets folder, they are assigned by the CSS file ‘color.css’ in the ‘stylesheets’ folder. The stylesheets folder contains:

  • Color, assignments for color, borders and opacity.
  • Layout, assignments for margins, padding and sizing.
  • Font, assignments for size, style and weight.
  • Round, assignments for rounded corners.

There is also an ‘adjustments’ folder, that contains any tweaks or overrides to the stylesheets. The themes called ‘Pixelmixer-Dark’, ‘Pixelmixer-Warm’ and ‘Pixelmixer-System’ are derived from the base theme. The Warm theme is a good example of creating a custom theme. The System theme is the current operating system theme with minimal changes.

These themes have been tested in Linux Mint and Windows 11, at 4k and at 1080p.

Enjoy!

Mark Sweeney
@pixelmixer


<
Previous Post
Plugin Examples - Getting Started
>
Next Post
A Script-Fu Library