Pick a colour and get all 44 formats at once — including GLSL, HLSL and WGSL vectors in both gamma and linear space. Paste any format back in and it converts to everything else.
Hex, CSS functions, shader vectors, engine constructors or raw numbers.
How white and black text read on this colour.
| Against | WCAG 2 | APCA | Usable for |
|---|---|---|---|
| White | 3.49:1 AA Large | Lc 62 | Headings and large text |
| Black | 6.02:1 AA | Lc 40 | Non-text elements only |
Save colours you want to revisit.
#4287f5rgb(66 135 245)hsl(216.9 89.9% 61%)hsv(216.9, 73.1%, 96.1%)oklch(63.521% 0.17906 259.418)cmyk(73.1%, 44.9%, 0%, 3.9%)vec3(0.259, 0.529, 0.961)float3(0.259, 0.529, 0.961)new Color(0.259f, 0.529f, 0.961f, 1.0f)FLinearColor(0.0545f, 0.2423f, 0.9131f, 1.0f)Color(0.259, 0.529, 0.961, 1)#4287f5rgb(66 135 245)rgb(66, 135, 245)rgb(25.88% 52.94% 96.08%)hsl(216.9 89.9% 61%)hsl(216.9, 89.9%, 61%)hsv(216.9, 73.1%, 96.1%)hwb(216.9 25.9% 3.9%)dodgerblue (approx.)cmyk(73.1%, 44.9%, 0%, 3.9%)oklch(63.521% 0.17906 259.418)oklab(63.521% -0.03288 -0.17602)lch(56.204% 63.033 276.032)lab(56.204% 6.623 -62.684)color(display-p3 0.3279 0.5231 0.9309)color(rec2020 0.3737 0.4757 0.917)color(srgb-linear 0.0545 0.2423 0.9131)color(xyz-d65 0.2739 0.2508 0.8979)vec3(0.259, 0.529, 0.961)vec4(0.259, 0.529, 0.961, 1.0)ivec3(66, 135, 245)float3(0.259, 0.529, 0.961)float4(0.259, 0.529, 0.961, 1.0)half4(0.259, 0.529, 0.961, 1.0)vec3f(0.259, 0.529, 0.961)vec4f(0.259, 0.529, 0.961, 1.0)vec3<f32>(0.054, 0.242, 0.913)new Color(0.259f, 0.529f, 0.961f, 1.0f)FLinearColor(0.0545f, 0.2423f, 0.9131f, 1.0f)Color(0.259, 0.529, 0.961, 1)Color(0xff4287f5)Color.rgb(66, 135, 245)Color(red: 0.259, green: 0.529, blue: 0.961)UIColor(red: 0.259, green: 0.529, blue: 0.961, alpha: 1)0x4287f50xff4287f5[0.259, 0.529, 0.961][66, 135, 245]4360181A vec3 destined for a lighting calculation is not the same as one written straight to the framebuffer. Both are shown, both are labelled, and the exact piecewise sRGB transfer function is used rather than a pow(2.2)approximation.
Hex, rgb(), oklch(), vec4,FLinearColor, Color(0xFF…), or three bare numbers. When the input genuinely could mean two things, you get to choose instead of being guessed at.
Conversions follow CSS Color 4. Matrix inverses are derived rather than transcribed, out-of-gamut colours are mapped in OKLCh instead of clipped, and the test suite checks that every format round-trips through its own parser.
Because the same three numbers mean different colours depending on where they are used. The sRGB row holds encoded values, which is what you want when writing a colour straight to the screen. The linear row has the sRGB transfer function removed, which is what you want when the value takes part in lighting, blending or filtering. Most tools only give you the first one, which is why shader colours so often come out too bright.
Hex in every shape including 0x and 8-digit ARGB, all the CSS colour functions, HSV, CMYK, shader constructors like vec3, vec4, float3, half4 and vec3f, engine types like Unity Color, Unreal FLinearColor, Godot Color, Flutter Color, SwiftUI Color and Android Color.rgb, plus bare number triples in 0–1, 0–255 or percentages.
You get told. A bare “1, 0, 0” could be normalised floats or a 0–255 triple, so the tool picks the most likely reading, shows you which one it chose, and offers the alternatives as one-click buttons. No silent guessing.
Every conversion follows the CSS Color 4 specification, using the exact piecewise sRGB transfer function rather than an approximate 2.2 power curve. Reference values from the specification are checked in the test suite, and every format is verified to parse its own output back to the same colour.
Colours from Display P3, Rec. 2020, Lab or OKLCh can fall outside what sRGB can show. Rather than clipping each channel, which shifts hue badly, the tool holds lightness and hue and walks chroma down until the colour fits. Formats that can hold the original value, such as color(display-p3 …), still show it untouched.