Readability Improvements in Dark mode

[lynxlove]

Describe the bug
The contrast is bad in few blocks in the dark mode which makes it hard to read the text in the block

Expected behavior
The text should be easily readable in both light and dark themes

Additional context
The constants and macros in this code block and more similar ones are barely visible. It would be great either to have a different color scheme specific to the dark mode or to leave the code blocks in light mode even when the other parts of UI is using the dark theme whichever feels the best to the team and other community members

The card descriptions are another place where the text is not easily visible

The contrast of tags are also a bit bad which is already raised in this report:

Contrast between tag background and tag text in Dark Mode makes reading the text difficult

Describe the bug With Dark Mode enabled, reading the text of Tags is difficult, as the contrast between the tag background and tag text is too little. To Reproduce Open any Set or Object which contains a populated Tag relation. Expected behavior Not strictly a bug, but adjusting the contrast between the tag background and tag text would help resolve this issue. System Information: OS: MacOS 12.0 Device Manufacturer/Model: Apple MacBook Air (2020, M1) Anytype Version: e.g. 0.21.0 Additio…

There is a clear difference between the primary and secondary text in the default theme

Which seems to be lost in the dark theme

One other similar place is the view type page where in the dark mode, the icons seem to have the same color as the text

Whereas the icons are slightly lighter and the tick in the selected view is clearly visible in the default theme

These are the few inconsistencies I could find with my limited usage. I’ll update this thread with other places that can be improved when they come by. Great work on the dark mode but few places feels like they are just inverted from the default theme which is what I’m documenting in this report.

Others members, please feel free to add images to the places that you feel could have improvements as well.

[Evan]

Agreed. I think the first version of dark mode is really good in a lot of aspects but there are still some improvements that need to be done.

One area in Anytype that struggles in dark mode would be assigning relations:

Even in light mode, it is a bit difficult to read too.

[boots]

Hi all,

I’d like to suggest a couple improvements for dark mode.

1. The line divider on Android looks too thin and low contrast:

Windows:

Android:

2. Text background color is too dark on Android:

Windows:

Android:

[Flip]

@lynxlove
The code syntax highlighting and the cards UI was changed.

Also in the set settings the colors were slightly adjusted.

@Evan
The name of the relations is now more readable.

[sambouwer]

@boots

The line divider on Android looks too thin and low contrast

I agree it could be clearer with a slightly thicker line and more towards white (now it is quite grey).

Same for background color, it is barely visible.

It is debatable whether these are bugs or feature requests, but because especially the background color is so difficult to see, I would think this was not intentionally set to these colors. It almost looks like there is a filter in front of the colors, also when selecting the colors in the styling menu.

[boots]

Agree!

Desktop dark mode is actually pretty enjoyable. On mobile though, you have to set brightness very high in order to actually see the background color.

So it’s also my guess this wasn’t intentional. Or maybe it was just an early implementation, dunno. Let’s hope to hear from the team!

[Angelo]

This issue has been added to our issue tracker and was received by the Development Team.