Color Contrast Spectrum Tester, by Joseph C Dolson

This test allows you to see a spectrum of color combinations with a color of your choice. The spectrum is sorted into groups which pass or fail the color contrast tests specified in the Web Content Accessibility Guidelines (WCAG) versions 1 and 2.

Table of color combinations which pass the WCAG 2 color contrast test with #000000
Color Tested	Contrast Samples	Luminosity Ratio
`#0078c8`	`#000000` `#0078c8`	4.52:1
`#0078f0`	`#000000` `#0078f0`	4.94:1
`#00a000`	`#000000` `#00a000`	6.03:1
`#00a028`	`#000000` `#00a028`	6.06:1
`#00a050`	`#000000` `#00a050`	6.14:1
`#00a078`	`#000000` `#00a078`	6.3:1
`#00a0a0`	`#000000` `#00a0a0`	6.54:1
`#00a0c8`	`#000000` `#00a0c8`	6.86:1
`#00a0f0`	`#000000` `#00a0f0`	7.29:1
`#00c800`	`#000000` `#00c800`	9.26:1
`#00c828`	`#000000` `#00c828`	9.29:1
`#00c850`	`#000000` `#00c850`	9.38:1
`#00c878`	`#000000` `#00c878`	9.53:1
`#00c8a0`	`#000000` `#00c8a0`	9.77:1
`#00c8c8`	`#000000` `#00c8c8`	10.1:1
`#00c8f0`	`#000000` `#00c8f0`	10.52:1
`#00f000`	`#000000` `#00f000`	13.46:1
`#00f028`	`#000000` `#00f028`	13.49:1
`#00f050`	`#000000` `#00f050`	13.58:1
`#00f078`	`#000000` `#00f078`	13.74:1
`#00f0a0`	`#000000` `#00f0a0`	13.97:1
`#00f0c8`	`#000000` `#00f0c8`	14.3:1
`#00f0f0`	`#000000` `#00f0f0`	14.72:1
`#2878c8`	`#000000` `#2878c8`	4.61:1
`#2878f0`	`#000000` `#2878f0`	5.04:1
`#28a000`	`#000000` `#28a000`	6.12:1
`#28a028`	`#000000` `#28a028`	6.15:1
`#28a050`	`#000000` `#28a050`	6.23:1
`#28a078`	`#000000` `#28a078`	6.39:1
`#28a0a0`	`#000000` `#28a0a0`	6.63:1
`#28a0c8`	`#000000` `#28a0c8`	6.95:1
`#28a0f0`	`#000000` `#28a0f0`	7.38:1
`#28c800`	`#000000` `#28c800`	9.35:1
`#28c828`	`#000000` `#28c828`	9.38:1
`#28c850`	`#000000` `#28c850`	9.47:1
`#28c878`	`#000000` `#28c878`	9.62:1
`#28c8a0`	`#000000` `#28c8a0`	9.86:1
`#28c8c8`	`#000000` `#28c8c8`	10.19:1
`#28c8f0`	`#000000` `#28c8f0`	10.61:1
`#28f000`	`#000000` `#28f000`	13.55:1
`#28f028`	`#000000` `#28f028`	13.58:1
`#28f050`	`#000000` `#28f050`	13.67:1
`#28f078`	`#000000` `#28f078`	13.83:1
`#28f0a0`	`#000000` `#28f0a0`	14.06:1
`#28f0c8`	`#000000` `#28f0c8`	14.39:1
`#28f0f0`	`#000000` `#28f0f0`	14.81:1
`#5078a0`	`#000000` `#5078a0`	4.54:1
`#5078c8`	`#000000` `#5078c8`	4.86:1
`#5078f0`	`#000000` `#5078f0`	5.29:1
`#50a000`	`#000000` `#50a000`	6.37:1
`#50a028`	`#000000` `#50a028`	6.4:1
`#50a050`	`#000000` `#50a050`	6.49:1
`#50a078`	`#000000` `#50a078`	6.64:1
`#50a0a0`	`#000000` `#50a0a0`	6.88:1
`#50a0c8`	`#000000` `#50a0c8`	7.2:1
`#50a0f0`	`#000000` `#50a0f0`	7.63:1
`#50c800`	`#000000` `#50c800`	9.6:1
`#50c828`	`#000000` `#50c828`	9.63:1
`#50c850`	`#000000` `#50c850`	9.72:1
`#50c878`	`#000000` `#50c878`	9.87:1
`#50c8a0`	`#000000` `#50c8a0`	10.11:1
`#50c8c8`	`#000000` `#50c8c8`	10.44:1
`#50c8f0`	`#000000` `#50c8f0`	10.86:1
`#50f000`	`#000000` `#50f000`	13.81:1
`#50f028`	`#000000` `#50f028`	13.84:1
`#50f050`	`#000000` `#50f050`	13.92:1
`#50f078`	`#000000` `#50f078`	14.08:1
`#50f0a0`	`#000000` `#50f0a0`	14.31:1
`#50f0c8`	`#000000` `#50f0c8`	14.64:1
`#50f0f0`	`#000000` `#50f0f0`	15.06:1
`#787828`	`#000000` `#787828`	4.52:1
`#787850`	`#000000` `#787850`	4.6:1
`#787878`	`#000000` `#787878`	4.76:1
`#7878a0`	`#000000` `#7878a0`	4.99:1
`#7878c8`	`#000000` `#7878c8`	5.32:1
`#7878f0`	`#000000` `#7878f0`	5.74:1
`#78a000`	`#000000` `#78a000`	6.83:1
`#78a028`	`#000000` `#78a028`	6.86:1
`#78a050`	`#000000` `#78a050`	6.94:1
`#78a078`	`#000000` `#78a078`	7.1:1
`#78a0a0`	`#000000` `#78a0a0`	7.33:1
`#78a0c8`	`#000000` `#78a0c8`	7.66:1
`#78a0f0`	`#000000` `#78a0f0`	8.09:1
`#78c800`	`#000000` `#78c800`	10.06:1
`#78c828`	`#000000` `#78c828`	10.09:1
`#78c850`	`#000000` `#78c850`	10.18:1
`#78c878`	`#000000` `#78c878`	10.33:1
`#78c8a0`	`#000000` `#78c8a0`	10.57:1
`#78c8c8`	`#000000` `#78c8c8`	10.89:1
`#78c8f0`	`#000000` `#78c8f0`	11.32:1
`#78f000`	`#000000` `#78f000`	14.26:1
`#78f028`	`#000000` `#78f028`	14.29:1
`#78f050`	`#000000` `#78f050`	14.38:1
`#78f078`	`#000000` `#78f078`	14.53:1
`#78f0a0`	`#000000` `#78f0a0`	14.77:1
`#78f0c8`	`#000000` `#78f0c8`	15.1:1
`#78f0f0`	`#000000` `#78f0f0`	15.52:1
`#a050f0`	`#000000` `#a050f0`	4.9:1
`#a07800`	`#000000` `#a07800`	5.18:1
`#a07828`	`#000000` `#a07828`	5.21:1
`#a07850`	`#000000` `#a07850`	5.3:1
`#a07878`	`#000000` `#a07878`	5.45:1
`#a078a0`	`#000000` `#a078a0`	5.69:1
`#a078c8`	`#000000` `#a078c8`	6.02:1
`#a078f0`	`#000000` `#a078f0`	6.44:1
`#a0a000`	`#000000` `#a0a000`	7.52:1
`#a0a028`	`#000000` `#a0a028`	7.55:1
`#a0a050`	`#000000` `#a0a050`	7.64:1
`#a0a078`	`#000000` `#a0a078`	7.79:1
`#a0a0a0`	`#000000` `#a0a0a0`	8.03:1
`#a0a0c8`	`#000000` `#a0a0c8`	8.36:1
`#a0a0f0`	`#000000` `#a0a0f0`	8.78:1
`#a0c800`	`#000000` `#a0c800`	10.76:1
`#a0c828`	`#000000` `#a0c828`	10.79:1
`#a0c850`	`#000000` `#a0c850`	10.87:1
`#a0c878`	`#000000` `#a0c878`	11.03:1
`#a0c8a0`	`#000000` `#a0c8a0`	11.26:1
`#a0c8c8`	`#000000` `#a0c8c8`	11.59:1
`#a0c8f0`	`#000000` `#a0c8f0`	12.01:1
`#a0f000`	`#000000` `#a0f000`	14.96:1
`#a0f028`	`#000000` `#a0f028`	14.99:1
`#a0f050`	`#000000` `#a0f050`	15.07:1
`#a0f078`	`#000000` `#a0f078`	15.23:1
`#a0f0a0`	`#000000` `#a0f0a0`	15.47:1
`#a0f0c8`	`#000000` `#a0f0c8`	15.79:1
`#a0f0f0`	`#000000` `#a0f0f0`	16.22:1
`#c800f0`	`#000000` `#c800f0`	4.71:1
`#c828c8`	`#000000` `#c828c8`	4.59:1
`#c828f0`	`#000000` `#c828f0`	5.02:1
`#c85000`	`#000000` `#c85000`	4.6:1
`#c85028`	`#000000` `#c85028`	4.63:1
`#c85050`	`#000000` `#c85050`	4.72:1
`#c85078`	`#000000` `#c85078`	4.87:1
`#c850a0`	`#000000` `#c850a0`	5.11:1
`#c850c8`	`#000000` `#c850c8`	5.44:1
`#c850f0`	`#000000` `#c850f0`	5.86:1
`#c87800`	`#000000` `#c87800`	6.14:1
`#c87828`	`#000000` `#c87828`	6.17:1
`#c87850`	`#000000` `#c87850`	6.26:1
`#c87878`	`#000000` `#c87878`	6.41:1
`#c878a0`	`#000000` `#c878a0`	6.65:1
`#c878c8`	`#000000` `#c878c8`	6.98:1
`#c878f0`	`#000000` `#c878f0`	7.4:1
`#c8a000`	`#000000` `#c8a000`	8.48:1
`#c8a028`	`#000000` `#c8a028`	8.51:1
`#c8a050`	`#000000` `#c8a050`	8.6:1
`#c8a078`	`#000000` `#c8a078`	8.76:1
`#c8a0a0`	`#000000` `#c8a0a0`	8.99:1
`#c8a0c8`	`#000000` `#c8a0c8`	9.32:1
`#c8a0f0`	`#000000` `#c8a0f0`	9.74:1
`#c8c800`	`#000000` `#c8c800`	11.72:1
`#c8c828`	`#000000` `#c8c828`	11.75:1
`#c8c850`	`#000000` `#c8c850`	11.83:1
`#c8c878`	`#000000` `#c8c878`	11.99:1
`#c8c8a0`	`#000000` `#c8c8a0`	12.23:1
`#c8c8c8`	`#000000` `#c8c8c8`	12.55:1
`#c8c8f0`	`#000000` `#c8c8f0`	12.98:1
`#c8f000`	`#000000` `#c8f000`	15.92:1
`#c8f028`	`#000000` `#c8f028`	15.95:1
`#c8f050`	`#000000` `#c8f050`	16.04:1
`#c8f078`	`#000000` `#c8f078`	16.19:1
`#c8f0a0`	`#000000` `#c8f0a0`	16.43:1
`#c8f0c8`	`#000000` `#c8f0c8`	16.75:1
`#c8f0f0`	`#000000` `#c8f0f0`	17.18:1
`#f00000`	`#000000` `#f00000`	4.71:1
`#f00028`	`#000000` `#f00028`	4.74:1
`#f00050`	`#000000` `#f00050`	4.82:1
`#f00078`	`#000000` `#f00078`	4.98:1
`#f000a0`	`#000000` `#f000a0`	5.21:1
`#f000c8`	`#000000` `#f000c8`	5.54:1
`#f000f0`	`#000000` `#f000f0`	5.96:1
`#f02800`	`#000000` `#f02800`	5.01:1
`#f02828`	`#000000` `#f02828`	5.04:1
`#f02850`	`#000000` `#f02850`	5.12:1
`#f02878`	`#000000` `#f02878`	5.28:1
`#f028a0`	`#000000` `#f028a0`	5.52:1
`#f028c8`	`#000000` `#f028c8`	5.84:1
`#f028f0`	`#000000` `#f028f0`	6.27:1
`#f05000`	`#000000` `#f05000`	5.85:1
`#f05028`	`#000000` `#f05028`	5.88:1
`#f05050`	`#000000` `#f05050`	5.97:1
`#f05078`	`#000000` `#f05078`	6.12:1
`#f050a0`	`#000000` `#f050a0`	6.36:1
`#f050c8`	`#000000` `#f050c8`	6.69:1
`#f050f0`	`#000000` `#f050f0`	7.11:1
`#f07800`	`#000000` `#f07800`	7.39:1
`#f07828`	`#000000` `#f07828`	7.42:1
`#f07850`	`#000000` `#f07850`	7.51:1
`#f07878`	`#000000` `#f07878`	7.66:1
`#f078a0`	`#000000` `#f078a0`	7.9:1
`#f078c8`	`#000000` `#f078c8`	8.23:1
`#f078f0`	`#000000` `#f078f0`	8.65:1
`#f0a000`	`#000000` `#f0a000`	9.73:1
`#f0a028`	`#000000` `#f0a028`	9.76:1
`#f0a050`	`#000000` `#f0a050`	9.85:1
`#f0a078`	`#000000` `#f0a078`	10:1
`#f0a0a0`	`#000000` `#f0a0a0`	10.24:1
`#f0a0c8`	`#000000` `#f0a0c8`	10.57:1
`#f0a0f0`	`#000000` `#f0a0f0`	10.99:1
`#f0c800`	`#000000` `#f0c800`	12.97:1
`#f0c828`	`#000000` `#f0c828`	13:1
`#f0c850`	`#000000` `#f0c850`	13.08:1
`#f0c878`	`#000000` `#f0c878`	13.24:1
`#f0c8a0`	`#000000` `#f0c8a0`	13.47:1
`#f0c8c8`	`#000000` `#f0c8c8`	13.8:1
`#f0c8f0`	`#000000` `#f0c8f0`	14.23:1
`#f0f000`	`#000000` `#f0f000`	17.17:1
`#f0f028`	`#000000` `#f0f028`	17.2:1
`#f0f050`	`#000000` `#f0f050`	17.28:1
`#f0f078`	`#000000` `#f0f078`	17.44:1
`#f0f0a0`	`#000000` `#f0f0a0`	17.68:1
`#f0f0c8`	`#000000` `#f0f0c8`	18:1
`#f0f0f0`	`#000000` `#f0f0f0`	18.43:1

Translations

Ke-Huan “Jedi” Lin — Traditional Chinese (Jedi Blog)
Carlos Alfonso — Portuguese (No web site provided.)
Aurélien Levy — French (fairytells)
Marjolein Katsma — Dutch (Marjolein Katsma)

« Color Contrast Article | Two-color Comparison | Accessible Design Blog | Joe Dolson Accessible Web Design