Couleur nommée · #030AA7
Cobalt
Cobalt correspond à #030AA7 : rgb(3 10 167), hsl(237 96% 33%), oklch(0.336 0.223 264.6). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Blue mean? → · Cobalt color name →
#030AA7
oklch(0.336 0.223 264.6)
Conversions de couleur
- HEX
- #030aa7
- RGB
- rgb(3 10 167)
- HSL
- hsl(237 96% 33%)
- HWB
- hwb(237 1% 35%)
- OKLCH
- oklch(0.336 0.223 264.6)
- OKLab
- oklab(0.336 -0.021 -0.222)
- CIE Lab
- lab(18.28 46.86 -79.78)
- LCH
- lch(18.28 92.52 300.4)
- CMYK
- cmyk(98% 94% 0% 35%)
Teintes · Ombres · Tons
Teintes
- 0E34B2
- 264FBD
- 3F67C7
- 587DD0
- 7293DA
- 8DA9E2
- A9BEEA
- C5D4F2
- E2E9F9
Ombres
- 020791
- 02057B
- 010366
- 010252
- 00013E
- 00012C
- 00001A
- 00000A
- 000001
Tons
- 0626A5
- 1236A2
- 1F429F
- 2D4D9C
- 3A5798
- 486095
- 566990
- 64718B
- 727986
Harmonies de couleurs
Complémentaire +180°
- 030AA7
Cobalt
- 473300
≈ Night in the Woods
Analogue -30° +30°
- 030AA7
Cobalt
- 003C56
≈ Duskwood
- 430089
≈ Grim Purple
Triadique +120° +240°
- 030AA7
Cobalt
- 6D000D
≈ Barolo
- 00440B
≈ Wailing Woods
Complémentaire divisée +150° +210°
- 030AA7
Cobalt
- 572900
≈ Fudge Brownie
- 363B00
≈ Dark Olive
Tétradique +90° +180° +270°
Contraste et accessibilité
Ag
AAASur blanc
WCAG 13.08:1 · APCA Lc 97
Ag
FailSur noir
WCAG 1.60:1 · APCA Lc 0
Meilleure couleur de texte: #FFFFFF
WCAG 13.08:1 (AAA) · APCA Lc 97
Contrast pairs
Extraits de code
CSS
:root {
--cobalt: #030aa7;
--cobalt-rgb: 3 10 167;
--cobalt-oklch: oklch(0.336 0.223 264.6);
}
.element {
color: var(--cobalt);
background-color: hsl(237 96% 33%);
border-color: oklch(0.336 0.223 264.6);
}Tailwind CSS v4
@theme {
--color-cobalt: #030aa7;
--color-cobalt-50: #d8f4ff;
--color-cobalt-100: #c6e6ff;
--color-cobalt-200: #a9d1ff;
--color-cobalt-300: #83b1ff;
--color-cobalt-400: #5b94ff;
--color-cobalt-500: #3874ff;
--color-cobalt-600: #3163eb;
--color-cobalt-700: #264fbd;
--color-cobalt-800: #133b8e;
--color-cobalt-900: #0c2865;
--color-cobalt-950: #021546;
}SCSS
$cobalt: #030aa7;
$cobalt-rgb: 3, 10, 167;
$cobalt-light: mix(#fff, $cobalt, 20%);
$cobalt-dark: mix(#000, $cobalt, 20%);
.element {
color: $cobalt;
box-shadow: 0 0 0 2px rgba($cobalt, 0.35);
}