2196F3 (Blue 500) — RGB, HSL, CMYK and Contrast
A blue at 54% lightness and 90% saturation, which puts it at 3.12:1 against white and 6.72:1 against black. The tables below give the notation conversions, the tints and shades that keep the hue intact, and the harmonies that pair with it.
Notation conversions
| Notation | Value |
|---|---|
| HEX | 2196F3 |
| RGB | rgb(33, 150, 243) |
| HSL | hsl(207, 90%, 54%) |
| CMYK | cmyk(86%, 38%, 0%, 5%) |
| Relative luminance | 0.2861 |
| Perceived brightness | 49.3 / 100 |
Contrast against pure white and pure black
Pair this colour with the two extremes to see which is the safer text partner. AA needs 4.5:1 for body text and 3:1 for large text; AAA raises that to 7:1 and 4.5:1.
| Against | Hex | Ratio | AA text | AA large | AAA text |
|---|---|---|---|---|---|
| #FFFFFF | white | 3.12:1 | fail | pass | fail |
| #000000 | black | 6.72:1 | pass | pass | fail |
Tints and shades
Lightness moves in ten-point steps while hue and saturation stay fixed, which keeps the colour recognisable in a scale. The last column is the ratio against white text, useful for deciding where a scale stops working as a background.
| Step | Hex | HSL | vs white text |
|---|---|---|---|
| shade -30 | #064475 | hsl(207, 90%, 24%) | 10.04:1 |
| shade -20 | #0960a5 | hsl(207, 90%, 34%) | 6.51:1 |
| shade -10 | #0c7cd5 | hsl(207, 90%, 44%) | 4.32:1 |
| tint +10 | #51adf6 | hsl(207, 90%, 64%) | 2.43:1 |
| tint +20 | #82c4f8 | hsl(207, 90%, 74%) | 1.87:1 |
| tint +30 | #b2dbfb | hsl(207, 90%, 84%) | 1.46:1 |
Harmonies
| Scheme | Hex |
|---|---|
| Complementary | #f37e21 |
| Analogous −30 | #21f3e7 |
| Analogous +30 | #212df3 |
| Triadic −120 | #96f321 |
| Triadic +120 | #f32196 |
Read back from the notation table, 2196F3 is rgb(33, 150, 243), which normalises to hue 206.6° at 89.7% saturation and 54.1% lightness. Its relative luminance of 0.2861 is what produces the two ratios above: 3.12:1 against white and 6.72:1 against black, a gap of 3.60. Position 42 of 69 in the colour library, it darkens to #064475 thirty points lower on the lightness axis and lifts to #b2dbfb thirty higher, while the complementary rotation lands on #f37e21.
Nearby colours
Frequently asked questions
What text colour should sit on 2196F3?
Black gives 6.72:1 and white gives 3.12:1, so black wins at 6.72:1. That clears the 4.5:1 AA threshold for normal text, but not the 7:1 AAA threshold.
Do the CMYK numbers match a print workflow?
They are the naive conversion from RGB, which assumes no ink limit, no colour profile and no black generation strategy. Real print work needs a profile-aware conversion; the values here are the ones the converter reports and are best used as a starting point for a designer rather than a press-ready separations file.
Convert any other colour, or test a pair against each other, in the ColrShift colour converter and contrast checker. The colour library groups every entry on this site by hue family.