InvokeAI icon indicating copy to clipboard operation
InvokeAI copied to clipboard

[enhancement], [usability]: increase selcted image checkmark contrast

Open thygrrr opened this issue 1 year ago • 2 comments

Is there an existing issue for this?

  • [X] I have searched the existing issues

Contact Details

Here on Github is good. :)

What should this feature add?

The green checkmark for the selected image is very difficult to see on many image backgrounds.

Repro: The attached image is upscaled to illustrate, it's much harder to see at "normal" sizes. Zoom out with the browser to get a useful size and see for yourself how the UI fares with different types of color vision impairment.

I compared the contrasts with https://www.color-blindness.com/coblis-color-blindness-simulator/, but even the standard contrast is much too low for images.

Normal is already hard:

Protanopic is difficult:

Deuteranopic is almost impossible:

Tritanopic is hard.

Alternatives

The mark should get an increased contrast; probably a black outer and a white inner outline will solve it for the most part, covering most image types. The green colour can be kept, but should be darkened because it is very light, which makes it difficult to distinguish from yellows for people with Deuteranopia.

Aditional Content

For example, the Windows Checkmark Emoji may be a start for a reference. image

The checkmark could also be moved away from the center of the image, where usually the main motif is visible.

thygrrr avatar Mar 16 '23 09:03 thygrrr

There has been no activity in this issue for 14 days. If this issue is still being experienced, please reply with an updated confirmation that the issue is still being experienced with the latest release.

github-actions[bot] avatar Mar 31 '23 06:03 github-actions[bot]

Updated confirmation. :)

thygrrr avatar Jun 13 '23 07:06 thygrrr