Colore con nome · #31668A
Drake’s Neck
Drake’s Neck è #31668A: rgb(49 102 138), hsl(204 48% 37%), oklch(0.49 0.081 240.8). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Drake’s Neck color name →
#31668A
oklch(0.49 0.081 240.8)
Conversioni di colore
- HEX
- #31668a
- RGB
- rgb(49 102 138)
- HSL
- hsl(204 48% 37%)
- HWB
- hwb(204 19% 46%)
- OKLCH
- oklch(0.49 0.081 240.8)
- OKLab
- oklab(0.49 -0.039 -0.071)
- CIE Lab
- lab(40.81 -9.25 -25.66)
- LCH
- lch(40.81 27.28 250.2)
- CMYK
- cmyk(64% 26% 0% 46%)
Tinte · Ombre · Toni
Tinte
- 467596
- 5A83A1
- 6E92AD
- 82A1B8
- 96B0C4
- ABC0D0
- BFCFDB
- D4DFE7
- EAEFF3
Ombre
- 295877
- 224A65
- 1A3C53
- 132F42
- 0C2332
- 061722
- 030C14
- 010407
- 000001
Toni
- 3A6989
- 436C89
- 4C6E88
- 547187
- 5B7486
- 637685
- 6A7984
- 727B83
- 797E81
Armonie di colore
Complementare +180°
- 31668A
Drake’s Neck
- 82552D
≈ Lion’s Lair
Analogo -30° +30°
- 31668A
Drake’s Neck
- 106C7A
≈ Carnival Night
- 4F5E8F
≈ Gem
Triadico +120° +240°
- 31668A
Drake’s Neck
- 864C5E
≈ Hawthorn Rose
- 5A6730
≈ Deathworld Forest
Complementare divisa +150° +210°
- 31668A
Drake’s Neck
- 884E44
≈ Rudraksha Beads
- 725E24
≈ Brassy Brass
Tetradico +90° +180° +270°
- 31668A
Drake’s Neck
- 7B4F76
≈ Phlox Flower Violet
- 82552D
≈ Lion’s Lair
- 3B6D48
≈ Jungle Adventure
Contrasto e accessibilità
Ag
AASu bianco
WCAG 6.17:1 · APCA Lc 81
Ag
FailSu nero
WCAG 3.39:1 · APCA Lc 21
Miglior colore del testo: #FFFFFF
WCAG 6.17:1 (AA) · APCA Lc 81
Contrast pairs
Frammenti di codice
CSS
:root {
--drake-s-neck: #31668a;
--drake-s-neck-rgb: 49 102 138;
--drake-s-neck-oklch: oklch(0.49 0.081 240.8);
}
.element {
color: var(--drake-s-neck);
background-color: hsl(204 48% 37%);
border-color: oklch(0.49 0.081 240.8);
}Tailwind CSS v4
@theme {
--color-drake-s-neck: #31668a;
--color-drake-s-neck-50: #e2f9ff;
--color-drake-s-neck-100: #d2ecff;
--color-drake-s-neck-200: #b7d9f5;
--color-drake-s-neck-300: #94bdde;
--color-drake-s-neck-400: #72a5ca;
--color-drake-s-neck-500: #518db7;
--color-drake-s-neck-600: #46779a;
--color-drake-s-neck-700: #375f7c;
--color-drake-s-neck-800: #26465b;
--color-drake-s-neck-900: #193140;
--color-drake-s-neck-950: #0a1d29;
}SCSS
$drake-s-neck: #31668a;
$drake-s-neck-rgb: 49, 102, 138;
$drake-s-neck-light: mix(#fff, $drake-s-neck, 20%);
$drake-s-neck-dark: mix(#000, $drake-s-neck, 20%);
.element {
color: $drake-s-neck;
box-shadow: 0 0 0 2px rgba($drake-s-neck, 0.35);
}