0

In android studio (official application for android programming) I have created a color I want as my primary color. However the application (Android Studio) complains that my color doesn't have enough contrast with the color black #000000 (which is used as a text color). I switched to dark theme, thinking that switching the text color (which the primary color has to complement to) to white #FFFFFF would surpass the error. However the error is still there.

android studio error

Here is my color: #35885C

Ignoring whatever this application says. I am in real doubt if my color complements best with black or white. Is there some sort of mathematical formula to calculate complaince with black/white, maybe other colors. Would black or white be best suited for this color? Imagine the provided green color with either white or black text on it, are both colors non-complaint with my color?

1 Answer 1

1

On black background it only fails for WCAG AAA, which is not mandatory, and it fails only on small font, so I'd say it's quite safe. Your contrast ratio is 4.83:1 and AA level requires 4.5:1 while AAA requires 7:1 for regular text, but 4.5 for big fonts

If we talk white background, you get 4.35:1, so it fails AA and AAA on regular text and it even fails on AAA large text

In short, if you want to keep on that shade of green and be compliant with both AA and AAA accessibility levels, you need to use the following:

White Background:

#24603F

Black background:

#3FAB70

and of course, you can check colors using the Contrast Checker Tool

2
  • 1
    I am very interrested in the contrast ratio you are speaking of. Any articles or something you know of, to try and understand the concept more deeply? Nice tip on the constrast checker tool! Commented Dec 13, 2018 at 22:08
  • 1
    Jonas, it's great that you're interested in accessibility, way to go! About your question, take a look to the first link in my answer, you have a very thorough explanation and link to more resources. If you need a formula, take a look to ux.stackexchange.com/questions/107318/… and you have a lot at w3.org/TR/WCAG20-TECHS/G17.html and w3.org/TR/WCAG20-TECHS/G18.html
    – Devin
    Commented Dec 13, 2018 at 22:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.