En yakın adlandırılmış renk · #60CDD4
#60CDD4
En yakın adlandırılmış renk: Sea Serpent
#60CDD4 (rgb(96 205 212), hsl(184 57% 60%), oklch(0.787 0.1 201)) en çok Sea Serpent adlı renge yakındır. Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
#60CDD4
oklch(0.787 0.1 201)
Renk dönüşümleri
- HEX
- #60cdd4
- RGB
- rgb(96 205 212)
- HSL
- hsl(184 57% 60%)
- HWB
- hwb(184 38% 17%)
- OKLCH
- oklch(0.787 0.1 201)
- OKLab
- oklab(0.787 -0.093 -0.036)
- CIE Lab
- lab(76.29 -31.12 -13.56)
- LCH
- lch(76.29 33.94 203.5)
- CMYK
- cmyk(55% 3% 0% 17%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 74D2D8
- 86D7DD
- 97DCE1
- A7E1E5
- B6E7EA
- C5EBEE
- D4F0F2
- E2F5F6
- F1FAFB
Koyu tonlar
- 52B2B8
- 45989D
- 387E83
- 2C6669
- 204E51
- 15383A
- 0A2324
- 030F10
- 000202
Gri tonlar
- 67C5CB
- 6CBDC3
- 71B6BA
- 74AEB2
- 78A6A9
- 7A9FA1
- 7C9799
- 7E8F90
- 7F8888
Renk uyumları
Tamamlayıcı +180°
- 60CDD4
Sea Serpent
- F3A09E
≈ Plum Blossom
Analog -30° +30°
- 60CDD4
Sea Serpent
- 71CFB1
≈ Sea Treasure
- 72C6EE
≈ Spritzig
Üçlü +120° +240°
- 60CDD4
Sea Serpent
- D7A5E1
≈ Plum Juice
- DBB36D
≈ Yellow Lab
Bölünmüş tamamlayıcı +150° +210°
- 60CDD4
Sea Serpent
- EB9FC2
≈ Be My Valentine
- EEA77E
≈ Orange Liqueur
Dörtlü +90° +180° +270°
- 60CDD4
Sea Serpent
- BAAFF5
≈ Winterspring Lilac
- F3A09E
≈ Plum Blossom
- BCC073
≈ Zoodles
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.87:1 · APCA Lc 35
Ag
AAASiyah üzerinde
WCAG 11.18:1 · APCA Lc 67
En iyi metin rengi: #000000
WCAG 11.18:1 (AAA) · APCA Lc 67
Contrast pairs
Kod parçacıkları
CSS
:root {
--sea-serpent: #60cdd4;
--sea-serpent-rgb: 96 205 212;
--sea-serpent-oklch: oklch(0.787 0.1 201);
}
.element {
color: var(--sea-serpent);
background-color: hsl(184 57% 60%);
border-color: oklch(0.787 0.1 201);
}Tailwind CSS v4
@theme {
--color-sea-serpent: #60cdd4;
--color-sea-serpent-50: #d5feff;
--color-sea-serpent-100: #c2f2f7;
--color-sea-serpent-200: #a1e1e7;
--color-sea-serpent-300: #76c7ce;
--color-sea-serpent-400: #48b0b7;
--color-sea-serpent-500: #0099a1;
--color-sea-serpent-600: #008288;
--color-sea-serpent-700: #00686d;
--color-sea-serpent-800: #004d4f;
--color-sea-serpent-900: #023537;
--color-sea-serpent-950: #002022;
}SCSS
$sea-serpent: #60cdd4;
$sea-serpent-rgb: 96, 205, 212;
$sea-serpent-light: mix(#fff, $sea-serpent, 20%);
$sea-serpent-dark: mix(#000, $sea-serpent, 20%);
.element {
color: $sea-serpent;
box-shadow: 0 0 0 2px rgba($sea-serpent, 0.35);
}