Adlandırılmış renk · #ACD6DB
Light Jellyfish Blue
Light Jellyfish Blue, #ACD6DB: rgb(172 214 219), hsl(186 39% 77%), oklch(0.848 0.045 205.3). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Cyan mean? → · Light Jellyfish Blue color name →
#ACD6DB
oklch(0.848 0.045 205.3)
Renk dönüşümleri
- HEX
- #acd6db
- RGB
- rgb(172 214 219)
- HSL
- hsl(186 39% 77%)
- HWB
- hwb(186 67% 14%)
- OKLCH
- oklch(0.848 0.045 205.3)
- OKLab
- oklab(0.848 -0.04 -0.019)
- CIE Lab
- lab(82.74 -13.43 -7.26)
- LCH
- lch(82.74 15.27 208.4)
- CMYK
- cmyk(21% 2% 0% 14%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- B4DADF
- BDDEE2
- C5E2E6
- CDE6E9
- D6EAED
- DEEFF1
- E6F3F4
- EEF7F8
- F7FBFB
Koyu tonlar
- 95BABE
- 7F9EA2
- 698487
- 546A6D
- 405254
- 2D3B3C
- 1B2526
- 0B1011
- 010202
Gri tonlar
- A8CDD2
- A3C4C8
- 9FBBBF
- 9BB3B6
- 96AAAC
- 92A2A3
- 8E999A
- 899191
- 858889
Renk uyumları
Tamamlayıcı +180°
- ACD6DB
Light Jellyfish Blue
- E9C3BE
≈ Congo
Analog -30° +30°
- ACD6DB
Light Jellyfish Blue
- B0D7CB
≈ Gemini
- B2D2E6
≈ Chapel Blue
Üçlü +120° +240°
- ACD6DB
Light Jellyfish Blue
- DDC4DD
≈ Simply Lavender
- DACBAD
≈ Soft Suede
Bölünmüş tamamlayıcı +150° +210°
- ACD6DB
Light Jellyfish Blue
- E6C2CE
≈ Primrose Pink
- E5C6B2
≈ Pastel Rose Tan
Dörtlü +90° +180° +270°
- ACD6DB
Light Jellyfish Blue
- CFC8E8
≈ Italian Fitch
- E9C3BE
≈ Congo
- CBD1B0
≈ Meadow Glen
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.56:1 · APCA Lc 26
Ag
AAASiyah üzerinde
WCAG 13.39:1 · APCA Lc 77
En iyi metin rengi: #000000
WCAG 13.39:1 (AAA) · APCA Lc 77
Contrast pairs
Kod parçacıkları
CSS
:root {
--light-jellyfish-blue: #acd6db;
--light-jellyfish-blue-rgb: 172 214 219;
--light-jellyfish-blue-oklch: oklch(0.848 0.045 205.3);
}
.element {
color: var(--light-jellyfish-blue);
background-color: hsl(186 39% 77%);
border-color: oklch(0.848 0.045 205.3);
}Tailwind CSS v4
@theme {
--color-light-jellyfish-blue: #acd6db;
--color-light-jellyfish-blue-50: #e7f9fc;
--color-light-jellyfish-blue-100: #d8ecef;
--color-light-jellyfish-blue-200: #bfdade;
--color-light-jellyfish-blue-300: #9ebec3;
--color-light-jellyfish-blue-400: #80a6ab;
--color-light-jellyfish-blue-500: #638f94;
--color-light-jellyfish-blue-600: #54797d;
--color-light-jellyfish-blue-700: #436164;
--color-light-jellyfish-blue-800: #304749;
--color-light-jellyfish-blue-900: #203133;
--color-light-jellyfish-blue-950: #101d1e;
}SCSS
$light-jellyfish-blue: #acd6db;
$light-jellyfish-blue-rgb: 172, 214, 219;
$light-jellyfish-blue-light: mix(#fff, $light-jellyfish-blue, 20%);
$light-jellyfish-blue-dark: mix(#000, $light-jellyfish-blue, 20%);
.element {
color: $light-jellyfish-blue;
box-shadow: 0 0 0 2px rgba($light-jellyfish-blue, 0.35);
}