Cor nomeada mais próxima · #A0C7DB
#A0C7DB
Cor nomeada mais próxima: Neptune’s Realm
#A0C7DB (rgb(160 199 219), hsl(200 45% 74%), oklch(0.808 0.05 230.4)) é mais próxima da cor nomeada Neptune’s Realm. Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
#A0C7DB
oklch(0.808 0.05 230.4)
Conversões de cor
- 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%)
Tons claros · Sombras · Tons
Tons claros
- AACDDF
- B3D2E2
- BCD8E6
- C6DDEA
- CFE3ED
- D9E8F1
- E2EEF4
- ECF4F8
- F5F9FB
Sombras
- 8BADBE
- 7693A2
- 617A87
- 4E626D
- 3B4C54
- 29363C
- 192126
- 090E11
- 010202
Tons
- 9DC0D2
- 9AB8C8
- 97B1BF
- 94AAB6
- 91A3AD
- 8D9CA3
- 8A959B
- 878E92
- 838789
Harmonias de cor
Complementar +180°
- A0C7DB
Neptune’s Realm
- DCB8A4
≈ Camel Hair
Análoga -30° +30°
- A0C7DB
Neptune’s Realm
- 9BCBCD
≈ Pentagon
- AEC1E1
≈ Promise
Tríade +120° +240°
- A0C7DB
Neptune’s Realm
- DBB4C5
≈ Mental Floss
- C1C49F
≈ Chameleon Tango
Complementar dividida +150° +210°
- A0C7DB
Neptune’s Realm
- DFB4B3
≈ Peachskin
- D1BD9C
≈ Pony Tail
Tétrade +90° +180° +270°
- A0C7DB
Neptune’s Realm
- CFB6D5
≈ Confectionary
- DCB8A4
≈ Camel Hair
- B0C9AA
≈ Relish
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.79:1 · APCA Lc 33
Ag
AAASobre preto
WCAG 11.68:1 · APCA Lc 69
Melhor cor de texto: #000000
WCAG 11.68:1 (AAA) · APCA Lc 69
Contrast pairs
Trechos de código
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);
}