Free tool
Brand colour checker
Can you put white text on your brand colour? See the answer, not a swatch - with the exact contrast ratios and a shade that works when yours does not.
These are WCAG's numbers, not ours.
4.5:1 is the minimum difference for normal body text, 3:1 is
enough for large or bold text. The calculation comes from the same class the builder's
theme uses, so a pair this page calls readable is one your site treats as readable. We say
nothing about which colours go together - that is taste, and we have no evidence about yours.
Questions
Because readability depends on the difference in brightness, not on whether the colours look nice together. Yellows, limes and light blues are bright, so white on them is very hard to read - and white is exactly what most people reach for on a coloured button. Dark text on the same colour is usually fine.
They are from WCAG, the international accessibility standard. 4.5:1 is the minimum difference for normal body text (that is level AA), 3:1 is enough for large or bold text, and 7:1 is the stricter AAA. These are not our numbers and not negotiable - which is why this tool can be exact rather than opinionated.
No. A colour that cannot carry body text still works perfectly well for buttons with large labels, badges, borders, icons and headings. What you should not do is set paragraphs or small print in it, or put white text on it and hope. The suggested shade is there if you want a version that does carry text.
Because which colours go together is taste, and we have no evidence about yours. Every number here is arithmetic from a published standard. A tool that mixed the two would be lending the authority of the first to the guesswork of the second.
The same contrast calculation, from the same class the builder's theme uses - so a pair this page calls readable is the one your site treats as readable. The accessibility checker runs it across a whole page, but only where an element sets both colours itself; here you supply them, so the answer is always available.