Color Code Converter

Understanding Color Models

Colors on screens and in print use different models to describe the same visual experience. The most common models for digital work are HEX, RGB, and HSL, while CMYK is the standard for print production.

HEX codes are the shorthand of the web — a six-character string like #FF5733 that encodes red, green, and blue values in hexadecimal. They're compact and universally supported in CSS, design tools, and image editors.

RGB: The Screen Standard

RGB (Red, Green, Blue) is an additive color model. Each channel ranges from 0 to 255, and combining all three at full intensity produces white. Your monitor, phone, and TV all use RGB to display color by combining tiny red, green, and blue light emitters.

RGBA adds an alpha channel (0 to 1) for transparency. In CSS, rgba(255, 87, 51, 0.5) creates a semi-transparent version of the color — useful for overlays, shadows, and glassmorphism effects.

HSL: Intuitive Color Selection

HSL (Hue, Saturation, Lightness) is designed to match how humans think about color. Hue is the color angle on the color wheel (0-360°), Saturation is the intensity (0% = gray, 100% = vivid), and Lightness is brightness (0% = black, 100% = white). This makes it easy to create harmonious color palettes — just shift the hue while keeping saturation and lightness constant.

CMYK: The Print Standard

CMYK (Cyan, Magenta, Yellow, Key/Black) is a subtractive color model used in printing. Unlike screens that emit light, printers layer inks that absorb (subtract) light. Converting from RGB to CMYK can shift colors because the printable color range (gamut) is narrower than what a screen can display. Always proof-check important print colors.