Improve Dark Mode

The fewer issues I have to read, the more new features I will have time to implement, so I ask that you please try these things first

Check out all the menus and keyboard shortcuts. Maybe the feature already exists?
Try with the newest version from GitHub
Read the documentation and FAQ, Known issues, Troubleshooting to see if the feature already exists
See if someone already suggested this under Issues or Discussions

Description

some UI still use white background, such as the Merge Files page, the scrollbar of "batch files" pannel (at left).
please improve the dark mode.

related #733

also an option to use the system theme

also an option to use the system theme

Yeah, I would appreciate an option to synchronize the UI to the system theme. For reference, Electron's native-theme API should work fine for this and supports Linux/Windows/macOS.

@mifi

@mifi I have a little suggestion: add style color-scheme

You can use color-scheme: light dark; to support both themes, even right now it would improve scroll bars, an example if you add this to html element styles via devtools:

Default styles:
With color-scheme and dark system theme:

Another screen example:

Default:
With:

Additionally there is light-dark() function that will allow you to style freely between both themes, like that:

.selector {
    background-color: light-dark(var(--light-background), var(--dark-background));
    color: light-dark(var(--light-text), var(--dark-text));
}

Currently lossless-cut use Chrome version 118, so it is not supported.

But if you upgrade Electron with a Chrome version 123 or newer, you can easily use it.

Well, it is also possible to manually restyle scrollbars with CSS instead of relying on color-scheme like that (Chrome-only):

*::-webkit-scrollbar {
	width: 8px;
	height: 8px;
	background-color: transparent;
}

*::-webkit-scrollbar-thumb {
	background-color: #8888;
}

*::-webkit-scrollbar:hover {
	background-color: #8883;
}

I've now added color-scheme according to the user's dark/light setting in the app

improve dark mode #1969

add `color-scheme`

improve dark mode #1969

dialogs should be properly dark now, and there's a new Settings → Theme → System default option to follow the OS. that one is only in the nightly builds for now https://mifi.no/llc/nightly/

Navigation Menu

Repository navigation

Improve Dark Mode #1969

The fewer issues I have to read, the more new features I will have time to implement, so I ask that you please try these things first

Description

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

Improve Dark Mode #1969

Description

The fewer issues I have to read, the more new features I will have time to implement, so I ask that you please try these things first

Description

Activity

mifi commented on Apr 18, 2024

ac615223s5 commented on Apr 22, 2024

Ige-fi commented on Apr 26, 2024

XCanG commented on May 14, 2024

XCanG commented on May 14, 2024

mifi commented on May 27, 2024

mifi commented on Oct 18, 2026

Metadata

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

Issue actions