Colore con nome più vicino · #003164
#003164
Colore con nome più vicino: Neptune’s Dream
#003164 (rgb(0 49 100), hsl(211 100% 20%), oklch(0.317 0.102 254.4)) è più vicino al colore con nome Neptune’s Dream. Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
#003164
oklch(0.317 0.102 254.4)
Conversioni di colore
- HEX
- #003164
- RGB
- rgb(0 49 100)
- HSL
- hsl(211 100% 20%)
- HWB
- hwb(211 0% 61%)
- OKLCH
- oklch(0.317 0.102 254.4)
- OKLab
- oklab(0.317 -0.027 -0.099)
- CIE Lab
- lab(19.94 2.45 -34.98)
- LCH
- lch(19.94 35.07 274)
- CMYK
- cmyk(100% 51% 0% 61%)
Tinte · Ombre · Toni
Tinte
- 1D4473
- 355883
- 4C6B92
- 647FA2
- 7D94B1
- 96A9C1
- AFBED0
- C9D3E0
- E4E9EF
Ombre
- 002956
- 002248
- 001A3B
- 00132E
- 000C22
- 000616
- 00030B
- 000103
- 000000
Toni
- 113967
- 1F416B
- 2C496E
- 385171
- 445974
- 506177
- 5C6979
- 68707C
- 74787E
Armonie di colore
Complementare +180°
- 003164
Neptune’s Dream
- 462C00
≈ Stirland Mud
Analogo -30° +30°
- 003164
Neptune’s Dream
- 003848
≈ Crowberry Blue
- 2E2763
≈ Paris M
Triadico +120° +240°
- 003164
Neptune’s Dream
- 5B1421
≈ Spinel Red
- 1C3B00
≈ Melancholia
Complementare divisa +150° +210°
- 003164
Neptune’s Dream
- 561E00
≈ Conker Brown
- 383300
≈ Wasabi Nori
Tetradico +90° +180° +270°
- 003164
Neptune’s Dream
- 53163E
≈ Violet Carmine
- 462C00
≈ Stirland Mud
- 003C29
≈ Deep Fir
Contrasto e accessibilità
Ag
AAASu bianco
WCAG 12.93:1 · APCA Lc 99
Ag
FailSu nero
WCAG 1.62:1 · APCA Lc 0
Miglior colore del testo: #FFFFFF
WCAG 12.93:1 (AAA) · APCA Lc 99
Contrast pairs
Frammenti di codice
CSS
:root {
--neptune-s-dream: #003164;
--neptune-s-dream-rgb: 0 49 100;
--neptune-s-dream-oklch: oklch(0.317 0.102 254.4);
}
.element {
color: var(--neptune-s-dream);
background-color: hsl(211 100% 20%);
border-color: oklch(0.317 0.102 254.4);
}Tailwind CSS v4
@theme {
--color-neptune-s-dream: #003164;
--color-neptune-s-dream-50: #e3f7ff;
--color-neptune-s-dream-100: #d2eaff;
--color-neptune-s-dream-200: #b8d7ff;
--color-neptune-s-dream-300: #96baec;
--color-neptune-s-dream-400: #74a1da;
--color-neptune-s-dream-500: #5488c8;
--color-neptune-s-dream-600: #4874a9;
--color-neptune-s-dream-700: #395c88;
--color-neptune-s-dream-800: #274465;
--color-neptune-s-dream-900: #1a2f47;
--color-neptune-s-dream-950: #0a1b2e;
}SCSS
$neptune-s-dream: #003164;
$neptune-s-dream-rgb: 0, 49, 100;
$neptune-s-dream-light: mix(#fff, $neptune-s-dream, 20%);
$neptune-s-dream-dark: mix(#000, $neptune-s-dream, 20%);
.element {
color: $neptune-s-dream;
box-shadow: 0 0 0 2px rgba($neptune-s-dream, 0.35);
}