Color Tester by MediaAndMe

A tool for webdesigner.

Create and test your color palette, validate color contrast for accessibility (WCAG 2.0), simulate your palette seen by a colorblind person, convert colors to HSLA, RGBA and hex for your CSS, convert to CMYK(1).

Once ready, share your palette with your team and export as CSS or swatch/palette for Adobe Photoshop, Adobe Illustrator, Adobe Indesign, Gimp, Inkscape and OpenOffice.

share
palette
export
palette

Export your palette for

    Contrast ratio
    WCAG
    normal
    • normal
    • deuteranomaly
    • deuteranopia
    • protanomaly
    • protanopia
    • tritanomaly
    • tritanopia
    • achromatopsia
    all
    • all
    • WCAG AA large font
    • WCAG AA full
    • WCAG AAA large font
    • WCAG AAA full
    text
    • background
    • text
    rgba
    • hex
    • hsl
    • hsla
    • rgb
    • rgba
    Open Sans
    • Arial
    • Baloo Paaji
    • Indie Flower
    • Lora
    • Open Sans
    • Open Sans Condensed
    • Quicksand
    • Roboto
    • Slabo 27px
    • Times New Roman
    • Verdana
    • Yellowtail

    (1) The CMYK color convertion is experimental, the color may differ from your screen rendering when printing and does not support opacity levels. It is always recommended to print the color and to check it before using it for production.

    (2) The WCAG 2.0 validation calculation takes opacity in consideration.
    This means that if a background has transparency (only with RGBA and HSLA), validity is based on the likelyhood that this background is over another colour resulting with the worst contrast.

    (3) The WCAG 2.0 recommandation for the limit between small and large font size is 12pt(19px). This is a reference for clear, neat and standardized fonts (such as Arial, Open Sans or Roboto). This means that depending on the font you choose, the minimum size may be bigger than 12pt(19px) to remain accessible and readable (as for Indie Flower, Quicksand or Yellowtail).