jibzar

Color Converter & Contrast Checker

Paste a color code in any form to get its HEX, RGB and HSL values. Pick a background color to see the contrast ratio and whether it passes the WCAG AA and AAA levels.

  • Fully offline

Loading…

Features

  • 3, 4, 6 and 8 digit HEX
  • rgb() and hsl() in legacy (comma) and modern (space and /) syntax
  • Alpha (transparency) support
  • WCAG contrast ratio with AA and AAA for normal and large text
  • Color picker and text-on-background preview
  • Works offline

Examples

HEX to RGB and HSL

Input
#ff8800
Output
rgb(255, 136, 0) · hsl(32, 100%, 50%)

Gray on white contrast

Input
#767676 on #ffffff
Output
4.54:1 (passes AA)

FAQ

What contrast ratio do I need?

WCAG requires at least 4.5:1 for normal text (AA) and 3:1 for large text. AAA requires 7:1.

How are transparent colors handled?

A semi-transparent color is first blended onto the background, then the contrast of the result is calculated.

Are color names like red supported?

Not yet; enter HEX, rgb() or hsl().