Skip to main content
Question

How to choose text's color in dark background

  • February 4, 2021
  • 4 replies
  • 9359 views

Arlene

when I design a page that has dark color background, I originally use white color text (hex FFFFFF). then I find some others great work use soft white on dark background (like hex: F5F5F5 etc). I find some answers about it says this can decreases eye strain and strengthens reading stamina.

but how to decide which soft white color to use of text on dark background, is there some general rules of picking text color or just decided by feeling?

4 replies

Josh
  • Former Community Manager
  • 1019 replies
  • February 5, 2021

I don’t think there’s a rule of thumb here. One thing you will want to check out though is the accessibility rating of the text color compared to background color. This can help you decide what colors to choose.

There are a few contrast checker and accessibility plugins that can help with this. Outside of that though I think it’s personal preference. 🙂


Mihael
  • 31 replies
  • February 5, 2021

As @Josh wrote, you decide on your own aesthetics, but the main thing to have in mind is accessibility. I suggest using the Contrast Checker (or some other contrast plugin) to detect is it AA or AAA compliant.
https://www.figma.com/community/plugin/733159460536249875/A11y---Color-Contrast-Checker


Arlene
  • Author
  • 27 replies
  • February 6, 2021

Thanks, Josh. That helps!


Arlene
  • Author
  • 27 replies
  • February 6, 2021

Thank you, Mihael. many thanks for sharing the link.


Reply


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings