Color Preview Tool

Enter any color code and see a preview with detailed information

Enter Color Code:

Enter any valid color format: HEX (#4287f5), RGB (rgb(66, 135, 245)), HSL (hsl(217, 90%, 61%)), or color name (blue)

Color Preview:

HEX: #4287f5

RGB: rgb(66, 135, 245)

HSL: hsl(217, 90%, 61%)

HSV: hsv(217, 73%, 96%)

CMYK: cmyk(73%, 45%, 0%, 4%)

XYZ: xyz(30, 32, 35)

LAB: lab(63, 0, 0)

LUV: luv(63, 10, 4)

HWB: hwb(0, 60%, 40%)

R: 66

G: 135

B: 245

H: 217°

S (HSL): 90%

L: 61%

S (HSV): 73%

V: 96%

Download Options

Text Preview

Text on Color

This is how text looks on this color background.

This is smaller text on this color background.

Color Text on White

This is how this color looks as text on white.

This is smaller text in this color on white.

Color Text on Black

This is how this color looks as text on black.

This is smaller text in this color on black.

About Color Formats

Understanding different color formats and their applications

HEX Color Format

HEX (hexadecimal) is a color format commonly used in web design and CSS. It represents colors using a combination of 6 hexadecimal digits:

• Format: #RRGGBB

• Each pair represents a color channel (red, green, blue)

• Values range from 00 to FF in hexadecimal (0-255 in decimal)

Example: #4287f5

RGB Color Format

RGB (Red, Green, Blue) is an additive color model used in digital displays:

• Format: rgb(R, G, B)

• Each value represents the intensity of a color channel

• Values range from 0 to 255

Example: rgb(66, 135, 245)

HSL Color Format

HSL (Hue, Saturation, Lightness) represents colors in a more intuitive way:

• Format: hsl(H, S%, L%)

• Hue: 0-360° (color wheel position)

• Saturation: 0-100% (color intensity)

• Lightness: 0-100% (brightness)

Example: hsl(217, 90%, 61%)

HSV/HSB Color Format

HSV (Hue, Saturation, Value) or HSB (Hue, Saturation, Brightness) is similar to HSL but with a different approach to brightness:

• Format: hsv(H, S%, V%)

• Hue: 0-360° (same as HSL)

• Saturation: 0-100% (color intensity)

• Value/Brightness: 0-100% (brightness)

Example: hsv(217, 73%, 96%)