Low Contrast Accessibility Issue

I am finding gray-on-black thin-line font unusably hard to read. It may have to do with my screen quality, and perhaps also my vision although excepting this contrast issue I have good eyesight.

Both this website and the Obsidian program are virtually unusable in parts in the default configuration. To be precise, the white text on black is fine. The grey text on black, the purple text on purple, the grey/purple icons, and the black text on purple are not.

I eventually through customizing the webpage appearance in chrome was able to discover that in Obsidian there is a help button (yes I did not see the three buttons in the lower left) and a settings button, and I could change the theme to Moonlit which I can actually see stuff in. This was a lot of work to discover, and if I hadn’t already a lot of respect for the team’s work in DynaList I would have given up.

Suggestion: Have a bright light-bulb icon that can switch the theme on your website.

EDIT: also applies to the help document. I set moonlit on Obsidian, opened Help, and it came up black.

2 Likes

Not sure this is a bug report.

I will move this to the general Obsidian discussion. I think @silver can follow up on this.
Perhaps she can increase the contrast on the default theme. Maybe we can have a pool to see if this is a widespread issue?

Even I face this problem many times in the Obsidian app.

the purple on white looks fine. However, the purple in the dark theme is at times hard to read, since I usually use my screen in low brightness.

using a lighter shade of purple would improve the readability in my opinion.

This applies to the start screens as well. I had extreme difficulty just proceeding from the front page to get the program started.

There is an edit control here to type a name. I do not see it. Browse is a button. It looks like it’s just text. The program happens to be over top this web page and i cannot see the window border nor the window controls. There is text below Obsidian (i think that’s my vault name, which vault I managed to create after a lot of effort?) and Obsidian Help but I cannot read it.

Could it be a difference in how your monitor display things?

For example, are you able to tell the contrast differences pointed with red arrows in this picture?

Change some colors in dark mode:

  • link text is visually hard to read due to color similar to background. Now text color is #8401D6 it could be e.g. #8484FF.
  • blue background under selected text is visually hard to distinguish from surrounding background. (especially with use of blue-light reducing technologies like “f.lux”)
  • When writing tables, grey “pipe” character | in edit mode is practically invisible on grey background. If the color matches e.g. color of folding marks or horizontal separators “—”, it should be fine.
    See e.g. section “### Tables” in [[Format your notes]]

Environment

  • Operating system: Windows 7
  • Obsidian version: 6.2.
  • Using custom CSS: No

Additional information

image

I would love to have the option of changing the text to an old school green, maybe with orange links. But yes color options would be great.

The default purple color looks fine in light mode, but becomes hard to read in the dark mode.

I think this old monitor’s the thing. I tried on a newer device and everything popped. But here, I can see differences in your discord image but they are slight and indistinct. On this forum, there are no color differences between blacks.

EDIT: lol, forum thinks the conversation is 10 days old.

Hmm, I think it’s just that @verma’s post got merged into this post. You can check your original post date.

I see, we might need a high contrast mode (these modes are quite common in apps like Bear Notes and Visual Studio Code) in the future for some monitors then. Using the same color scheme would make everything pop too much for newer monitors.

High contrast I find obnoxious in these programs. I just want a #444 against black. for distinct background and #aaa or whiter for text.

Definitely not going to go overboard with high contrast like this:

That pops too much even on low contrast monitors.

Once you get into this issue you’ll find that there’s a host of different problems. Mine is variations in light intensity and a problem with monitors and windows although a bright day outside is manageable (and sunglasses are always an option). I’ve tried a ton of solutions.
White on black can be a problem, cream on brown is better (precise colours matter). So they’re the programs I prefer to use. Ended up forced to inverse color mode, and even then I have to ration the time I spend on a PC.
Luckily the issue is less intense on tablets and phones and many apps have dark mode (and white on black is fine there). There’s a niggle with apps that save screen preference because inverse color will want it the other way round.

I found a temporary solution for now. you can enable community themes if the default colors are not well suited for you.

I have enabled Obsidian gruvbox theme by insanum to replace the faint purple color with a brighter version of orange.

So far worked well for me.

Seems like a great option. Just be aware you lost people at the start who couldn’t see a thing. Those people won’t report in. I highly suggest at least making sure the settings button is visible to everybody. And fixing the startup screen so that’s got visible controls.

2 Likes

I have the same problem, I can see much in Dark Mode. Internal links and buttons are very difficult to find. I am also using f.lux which make it worse. I think if devs want to keep the current colors they can at least add more options. I am really liking this app, hope it gets even better soon.