My personal darktable theme.

Hello.

First of all thank you very much to all the developers involved in the creation of this excellent raw developer program. I like develop images in the program more and more.

As I spend many hours working on this and other programs, I have chosen to use a dark interface in the system (Linux-Fedora 35) and practically all the applications I use as well. darktable is no exception, so, based on the dark theme (darktable-elegant-darker) I made some tweaks in the .css to adjust it to my taste. Specifically using the orange color as emphasis in icons, sliders and selectors.

I recognize that my theme does not follow the guidelines outlined by the developers in terms of sobriety and that optically does not behave like the predefined themes that have been carefully created by the developers avoiding the negative effects generated by optical illusions (https://www.wikiwand.com/en/Checker_shadow_illusion). This theme is a very personal taste.

I share this theme with users who wish to use it. “At your own risk, and I am not responsible for damage caused to visual health or hardware used” :wink:

This is the file:
darktable-Pro-v02.zip (4.5 KB)

I have also included the configuration of the metadata displayed in the lighttable, the popups and in the bottom bar of the darkroom.

darktablePreferences - darkroom pattern for the image infos line.zip (695 Bytes)

If someone wants to install it, can do it following this steps:

Here are some screenshots so you can see how it looks like, before anyone ventures to install it.

Please, comments to improve it would be welcome. And if anyone knows any other little trick with the .css to improve it, it would be great too, as I am not a programmer, there are things that I’m not clear enough to optimize it, anyway, it is based on the dark theme and the modifications are superimposed on those that brings the darktable.css theme.

Greetings from Habana, Cuba.

28 Likes

Awesome! Thanks form sharing

1 Like

Thanks for sharing Franklin.

It looks great! :ok_hand:t2:

2 Likes

Very nice indeed!

I’ve been using an extended image info line for a long time, but you took things to a whole new level.

Thanks for sharing what must have been a lot of work.

2 Likes

Thanks, yes indeed!

I just gave this theme a try and, except for one issue, it works nicely.

The issue: When selecting this theme darktable fails to load this theme with a:

dt_gui_load_theme: error parsing combined CSS @import url('file:///home/jade/.config/darktable/themes/darktable-Pro-v02.css');: darktable-Pro-v02.css:19:29Failed to import: Error opening file /home/jade/.config/darktable/themes/darktable.css: No such file or directory

Which is correct: darktable.css (and darktable-icons.css) are not to be found in the ~/.config/darktable/themes/ directory but are in darktable’s default themes directory.

I’m not sure if this is a darktable bug, although I think it is: darktable should look in the current directory and fall back on the default directory when it can’t find them.

This can be fixed by hardcoding the full path in darktable-Pro-v02.css.

I.e.: change this (Linux example):

@import url("darktable.css");
@import url("darktable-icons.css");

To this:

@import url("/full/path/to/share/darktable/themes/darktable.css");
@import url("/full/path/to/share/darktable/themes/darktable-icons.css");
7 Likes

Franklin muchas gracias por compartir el tema. Probado (Mac OSX 11.5.&) y adoptado !!!

2 Likes

Great stuff! Thank you!

1 Like

Then this must be reported to GitHub, no? This is a minor issue, but can be tricky for some users.

Here you are:

If you have this experience on MacOS or Windows, please add that to this report (I’m not able to test this myself…). (no need to do this any longer)

4 Likes

Looks awesome :fire:
Many thanks!

1 Like

This is the only part of the modules I don’ t know how to tweak to put it in black like the others modules background :thinking:

Very nice, Franklin!

For those running dt on their Mac boxes, you may wish to consider saving the theme to your local .config file rather than to the “Contents” of the app. Doing the former ensures that the new theme won’t disappear after an upgrade.

4 Likes

That’s great to know. Thanks!!

Thanks for sharing

1 Like

First, great job @difrkaguilar. As you said, it’s not on darktable standard and you explain it great. Anyway, it’s a beautiful and well made theme. Like that.

About tone curve and tone curve rvb, you so just show a bug. All graph are set by graph lines at the beginning of css file. But this doesn’t apply on those ones. It’s not possible to fix that with CSS actually. That just means that background on those graphs remains hardcoded and had not been moved to be fixed with CSS. I will post an issue to ask for some help to fix that (I don’t have skills for that part!). Link to the issue: https://github.com/darktable-org/darktable/issues/10926

About your first post here, I suggest you to update it and change lines about where to put your css file. It’s not a good thing to suggest to save it in darktable system folder (theme file added manually could be removed in a next update). The theme should only be copied in darktable config user folder. I suggest to change your 3 lines by those:

Linux: ~/.config/darktable/themes/

MacOS: ~/.config/darktable/themes/

Windows: C:\%LOCALAPPDATA%\darktable where %LOCALAPPDATA% should be something like C:\Users\username\AppData\Local

@difrkaguilar: another thing, you set 2 lines to import darktable.css and darktable-icons.css. That means you import 2 times darktable.css. darktable.css file is the main theme where all things of the UI are set (black default one with OS font used). Then all elegant themes import darktable.css content and inherit from it and just change what they are for. icons css files just add icons on darkroom modules to related theme, so inherit from it. So if you import darktable-icons.css file, you import also darktable.css file and add icons. So use darktable.css file if you want default theme without icons and darktable-icons.css one if you want icons too.

Last thing, darktable propose a way to edit/change directly from darktable CSS theme. That’s why there’s no link directly to darktable system folder. This way is in main darktable settings, in first tab.

So to link to darktable default themes, just copy past lines, all after import ones, of CSS theme proposed by @difrkaguilar here in CSS editor in main darktable settings. This editor create/use a user.css file inside .config/darktable folder (links above).

3 Likes

Thank you very much, I will realize your suggestions in the next few hours. :slightly_smiling_face: :+1:

1 Like

I’ll do it ASAP.

There’s no longer any need. Have a look at the, now closed, issue and the new one.

Nilvus and elstoc (and me in a way) have reached an agreement on how to tackle this problem.

In short: use user.css instead of a home made style that is put in ~/.config/darktable/themes/

user.css can be filled/tested using darktable itself (preferences->general->css section). It puts its changes on top of the selected theme, so no need to include @import url xyz. This makes it completely OS independent. You can also edit the file by hand, it is read when darktable starts.

All this means that you can take your darktable-Pro-v02.css file, remove the first 21 lines (up to the This has been tested with line), save and rename it to ~/.config/darktable/user.css

Start darktable and go to preferences->general select the darktable-icons theme and tick modify selected theme with CSS tweaks below

6 Likes

Great. Updated, tested and adopted. :smiley:

user.zip (4.0 KB)

Now users can select darktable or darktable-icons themes and paste the user.css to the entry section in the general tab of the darktable preferences window.

or copy the user.css to: ~/.config/darktable

@Jade_NL @Nilvus and @elstoc thanks for the review.

5 Likes