Couleur nommée la plus proche · #A0C7DB
#A0C7DB
Couleur nommée la plus proche: Neptune’s Realm
#A0C7DB (rgb(160 199 219), hsl(200 45% 74%), oklch(0.808 0.05 230.4)) est la plus proche de la couleur nommée Neptune’s Realm. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#A0C7DB
oklch(0.808 0.05 230.4)
Conversions de couleur
- HEX
- #a0c7db
- RGB
- rgb(160 199 219)
- HSL
- hsl(200 45% 74%)
- HWB
- hwb(200 63% 14%)
- OKLCH
- oklch(0.808 0.05 230.4)
- OKLab
- oklab(0.808 -0.032 -0.039)
- CIE Lab
- lab(77.91 -10.01 -14.49)
- LCH
- lch(77.91 17.61 235.4)
- CMYK
- cmyk(27% 9% 0% 14%)
Teintes · Ombres · Tons
Teintes
- AACDDF
- B3D2E2
- BCD8E6
- C6DDEA
- CFE3ED
- D9E8F1
- E2EEF4
- ECF4F8
- F5F9FB
Ombres
- 8BADBE
- 7693A2
- 617A87
- 4E626D
- 3B4C54
- 29363C
- 192126
- 090E11
- 010202
Tons
- 9DC0D2
- 9AB8C8
- 97B1BF
- 94AAB6
- 91A3AD
- 8D9CA3
- 8A959B
- 878E92
- 838789
Harmonies de couleurs
Complémentaire +180°
- A0C7DB
Neptune’s Realm
- DCB8A4
≈ Camel Hair
Analogue -30° +30°
- A0C7DB
Neptune’s Realm
- 9BCBCD
≈ Pentagon
- AEC1E1
≈ Promise
Triadique +120° +240°
- A0C7DB
Neptune’s Realm
- DBB4C5
≈ Mental Floss
- C1C49F
≈ Chameleon Tango
Complémentaire divisée +150° +210°
- A0C7DB
Neptune’s Realm
- DFB4B3
≈ Peachskin
- D1BD9C
≈ Pony Tail
Tétradique +90° +180° +270°
- A0C7DB
Neptune’s Realm
- CFB6D5
≈ Confectionary
- DCB8A4
≈ Camel Hair
- B0C9AA
≈ Relish
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.79:1 · APCA Lc 33
Ag
AAASur noir
WCAG 11.68:1 · APCA Lc 69
Meilleure couleur de texte: #000000
WCAG 11.68:1 (AAA) · APCA Lc 69
Contrast pairs
Extraits de code
CSS
:root {
--neptune-s-realm: #a0c7db;
--neptune-s-realm-rgb: 160 199 219;
--neptune-s-realm-oklch: oklch(0.808 0.05 230.4);
}
.element {
color: var(--neptune-s-realm);
background-color: hsl(200 45% 74%);
border-color: oklch(0.808 0.05 230.4);
}Tailwind CSS v4
@theme {
--color-neptune-s-realm: #a0c7db;
--color-neptune-s-realm-50: #e8f8ff;
--color-neptune-s-realm-100: #d8ebf6;
--color-neptune-s-realm-200: #c0d9e6;
--color-neptune-s-realm-300: #9fbccd;
--color-neptune-s-realm-400: #81a4b7;
--color-neptune-s-realm-500: #638da1;
--color-neptune-s-realm-600: #557788;
--color-neptune-s-realm-700: #435f6d;
--color-neptune-s-realm-800: #304650;
--color-neptune-s-realm-900: #203038;
--color-neptune-s-realm-950: #101d22;
}SCSS
$neptune-s-realm: #a0c7db;
$neptune-s-realm-rgb: 160, 199, 219;
$neptune-s-realm-light: mix(#fff, $neptune-s-realm, 20%);
$neptune-s-realm-dark: mix(#000, $neptune-s-realm, 20%);
.element {
color: $neptune-s-realm;
box-shadow: 0 0 0 2px rgba($neptune-s-realm, 0.35);
}