Skip to content
ColorPlum

Tools

Color converter and Delta E: every format, Display P3 and app code

Paste a color in any common notation and get it in every CSS format, as Display P3, and as ready-to-paste code for iOS, Android, Flutter and Unity. Then compare it with a second color: Delta E (CIEDE2000, CIE76 and OKLab) tells you whether a match would pass a print or brand check.

#7B3F8CDisplay P3: 0.4513 0.2592 0.5329
  • HEX#7B3F8C
  • RGBrgb(123, 63, 140)
  • HSLhsl(287, 38%, 40%)
  • HSV287°, 55%, 55%
  • CMYK12%, 55%, 0%, 45%
  • Lablab(37% 36.1 -32.2)
  • OKLCHoklch(47.5% 0.135 318.4)
  • Decimal8077196
  • CSS hex with alpha#7B3F8CFF
  • CSS rgb() percentagesrgb(48.2% 24.7% 54.9%)
  • CSS Display P3color(display-p3 0.4513 0.2592 0.5329)
  • CSS color(srgb)color(srgb 0.482 0.247 0.549)
  • SwiftUIColor(red: 0.482, green: 0.247, blue: 0.549)
  • UIKit (Swift)UIColor(red: 0.482, green: 0.247, blue: 0.549, alpha: 1.0)
  • Android XML<color name="brand">#FF7B3F8C</color>
  • Jetpack ComposeColor(0xFF7B3F8C)
  • FlutterColor(0xFF7B3F8C)
  • Unity (C#)new Color(0.482f, 0.247f, 0.549f, 1f)
  • Normalized RGB (0-1)0.482, 0.247, 0.549
  • Integer (ARGB)4286267276

Compare two colors (Delta E)

How different two colors look, the way print shops and brand teams check a match: under 1 is invisible, under 2 needs a close look.

CIEDE2000
4.36
CIE76
5.09
OKLab ×100
4.31

Clearly noticeable at a glance. Between them, text contrast is 1.20:1.

On this page

A brand color travels. It starts as a hex code in a style guide, then turns up as an rgb() value in a stylesheet, a Color() in a SwiftUI view, an ARGB integer in an Android resource and a swatch on a printer's proof. Each place wants it written differently, and each rewrite is a chance for a typo. This converter writes them all from one input, and its second half checks whether two colors that should match really do.

What you can paste in

The input reads hex (three or six digits, with or without #), rgb() with commas or spaces, hsl(), a bare "123, 63, 140" triple, and any of the 148 CSS color names or the xkcd survey names. You can also drop a swatch from anywhere on the site onto either box.

What comes out

Every CSS notation: hex, rgb(), hsl(), HSV, CMYK, Lab, OKLCH, color(srgb …) and the decimal value. Display P3 is the wide-gamut space of recent Apple screens and many phones; the converter writes your color in color(display-p3 …) so a stylesheet can use the wider space while describing the same color. Then come platform codes: SwiftUI and UIKit for iOS, an Android XML resource, Jetpack Compose, Flutter, Unity and a normalized 0-1 triple for shaders and 3D tools.

Delta E, briefly

Delta E is a single number for how different two colors look. The converter shows three versions. CIEDE2000 is the modern standard used for print and brand approval; it corrects the older formula where the eye is most and least sensitive. CIE76 is the plain distance in Lab, still quoted on older spec sheets. OKLab ×100 is the distance in the space ColorPlum's other tools use. As a rough guide to CIEDE2000: under 1 nobody can see a difference, 1 to 2 shows only side by side on close inspection, 2 to 3.5 is a small difference many brand checks accept, and above 5 the colors look clearly different.

Worked example

A print shop sends back a proof of a plum logo and you scan the swatch as #8A4A99 against the brand's #7B3F8C. CIEDE2000 comes out at 4.36 (CIE76 5.09, OKLab 4.31), which the converter reads as clearly noticeable at a glance, so the proof should go back. A second proof scans as #7D408E: CIEDE2000 0.52, below what the eye can detect, so that one passes. The same brand color for the app team is Color(0xFF7B3F8C) in Jetpack Compose and Flutter, and color(display-p3 0.4513 0.2592 0.5329) in a wide-gamut stylesheet.

Limits worth knowing

Every value here is computed from sRGB, the color space of hex codes. A scanner or camera reading of a printed swatch is itself an approximation, so treat Delta E from a scan as a guide and check the physical proof under good light. CMYK values are a simple device-independent conversion, not a profile for a particular press.

Sources

  1. W3C, CSS Color Module Level 4: predefined color spaces, Display P3 and conversion code (checked 2026-11-10) w3.org
  2. Sharma, Wu and Dalal, The CIEDE2000 color-difference formula: implementation notes (Color Research and Application, 2005) doi.org
  3. W3C, CSS Color Module Level 4: converting sRGB to Lab (checked 2026-11-10) w3.org