UtilHub

Color Picker

Pick any color from the color palette below, or enter a color value directly to instantly see all its format conversions.

Pick a Color:

Hue:

217°

Opacity:

100%

name, hex, rgb, hsl, oklch, hwb, cmyk, ncol

FormatValue
Name-
Hex#3b82f6
RGBrgb(59, 130, 246)
HSLhsl(217, 91%, 60%)
OKLCHoklch(62.3% 0.1880 259.81)
HWBhwb(217, 23%, 4%)
CMYKcmyk(76%, 47%, 0%, 4%)
NColC62, 23%, 4%

Lighter / Darker:

#ffffff
#e7f0fe
#bbd4fc
#8fb8fa
#639cf8
#3780f6
#0b64f4
#0952c8
#07409c
#052e70
#031c44
#010a18
#000000


Contrast Checker

WCAG contrast ratios for this color as text on white and black - and for white and black text on this color as background.

Hey thereHave a wonderful day.
Contrast Ratio 3.68:1
AAAA LargeAAAAAA Large
Hey thereHave a wonderful day.
Contrast Ratio 5.71:1
AAAA LargeAAAAAA Large
Hey thereHave a wonderful day.
Contrast Ratio 3.68:1
AAAA LargeAAAAAA Large
Hey thereHave a wonderful day.
Contrast Ratio 5.71:1
AAAA LargeAAAAAA Large

How to Use This Tool

Click any swatch in the color palette to instantly load that color and see all its format conversions - HEX, RGB, HSL, HWB, CMYK, and more. You can also type any color value in the “Or enter a Color” field - HEX (e.g. #3b82f6), RGB, HSL, or a CSS color name - and the tool will parse it instantly. Click any format row in the table to copy its value to your clipboard. Use the Lighter / Darker bar to explore tints and shades of the selected color.