Adlandırılmış renk · #CDE7DD
Light Otto Ice
Light Otto Ice, #CDE7DD: rgb(205 231 221), hsl(157 35% 85%), oklch(0.906 0.031 170.5). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Light Otto Ice color name →
#CDE7DD
oklch(0.906 0.031 170.5)
Renk dönüşümleri
- HEX
- #cde7dd
- RGB
- rgb(205 231 221)
- HSL
- hsl(157 35% 85%)
- HWB
- hwb(157 80% 9%)
- OKLCH
- oklch(0.906 0.031 170.5)
- OKLab
- oklab(0.906 -0.03 0.005)
- CIE Lab
- lab(89.51 -10.3 1.83)
- LCH
- lch(89.51 10.46 170)
- CMYK
- cmyk(11% 0% 4% 9%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- D2E9E0
- D7ECE4
- DCEEE7
- E1F1EA
- E6F3EE
- EBF5F1
- F0F8F5
- F5FAF8
- FAFDFC
Koyu tonlar
- B2C9C0
- 98ABA4
- 7E8F88
- 66736E
- 4E5955
- 38403D
- 232826
- 0F1311
- 020302
Gri tonlar
- C5DCD3
- BDD2CA
- B5C7C0
- AEBDB7
- A6B2AD
- 9EA8A4
- 979E9B
- 8F9492
- 878A89
Renk uyumları
Tamamlayıcı +180°
- CDE7DD
Light Otto Ice
- F1D8E3
≈ Brittany’s Bow
Analog -30° +30°
- CDE7DD
Light Otto Ice
- D6E5D2
≈ Light Mystified
- CAE7E8
≈ Starship Tonic
Üçlü +120° +240°
- CDE7DD
Light Otto Ice
- DFDDF3
≈ Chinese Silver
- F2DBCE
≈ Possibly Pink
Bölünmüş tamamlayıcı +150° +210°
- CDE7DD
Light Otto Ice
- EADAED
≈ Pale Grey Magenta
- F4D9D7
≈ Scented Valentine
Dörtlü +90° +180° +270°
- CDE7DD
Light Otto Ice
- D5E1F5
≈ Aquarelle Purple
- F1D8E3
≈ Brittany’s Bow
- EBDECA
≈ Silk for the Gods
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.30:1 · APCA Lc 15
Ag
AAASiyah üzerinde
WCAG 16.07:1 · APCA Lc 89
En iyi metin rengi: #000000
WCAG 16.07:1 (AAA) · APCA Lc 89
Contrast pairs
Kod parçacıkları
CSS
:root {
--light-otto-ice: #cde7dd;
--light-otto-ice-rgb: 205 231 221;
--light-otto-ice-oklch: oklch(0.906 0.031 170.5);
}
.element {
color: var(--light-otto-ice);
background-color: hsl(157 35% 85%);
border-color: oklch(0.906 0.031 170.5);
}Tailwind CSS v4
@theme {
--color-light-otto-ice: #cde7dd;
--color-light-otto-ice-50: #edf8f4;
--color-light-otto-ice-100: #deebe7;
--color-light-otto-ice-200: #c8d9d3;
--color-light-otto-ice-300: #a8bdb6;
--color-light-otto-ice-400: #8da59c;
--color-light-otto-ice-500: #738d83;
--color-light-otto-ice-600: #61776f;
--color-light-otto-ice-700: #4e5f59;
--color-light-otto-ice-800: #384640;
--color-light-otto-ice-900: #27302c;
--color-light-otto-ice-950: #151d19;
}SCSS
$light-otto-ice: #cde7dd;
$light-otto-ice-rgb: 205, 231, 221;
$light-otto-ice-light: mix(#fff, $light-otto-ice, 20%);
$light-otto-ice-dark: mix(#000, $light-otto-ice, 20%);
.element {
color: $light-otto-ice;
box-shadow: 0 0 0 2px rgba($light-otto-ice, 0.35);
}