Adlandırılmış renk · #C5E5DD
Touch of Frost
Touch of Frost, #C5E5DD: rgb(197 229 221), hsl(165 38% 84%), oklch(0.896 0.035 178.7). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Teal mean? → · Touch of Frost color name →
#C5E5DD
oklch(0.896 0.035 178.7)
Renk dönüşümleri
- HEX
- #c5e5dd
- RGB
- rgb(197 229 221)
- HSL
- hsl(165 38% 84%)
- HWB
- hwb(165 77% 10%)
- OKLCH
- oklch(0.896 0.035 178.7)
- OKLab
- oklab(0.896 -0.035 0.001)
- CIE Lab
- lab(88.44 -12.05 0.2)
- LCH
- lch(88.44 12.05 179.1)
- CMYK
- cmyk(14% 0% 3% 10%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- CBE8E0
- D1EAE4
- D7EDE7
- DCEFEA
- E2F2EE
- E8F5F1
- EEF7F5
- F3FAF8
- F9FCFC
Koyu tonlar
- ABC7C0
- 92AAA4
- 798E88
- 61726E
- 4B5855
- 353F3D
- 212826
- 0E1211
- 020302
Gri tonlar
- BEDAD3
- B7D0CA
- B0C6C0
- A9BBB7
- A2B1AD
- 9BA7A4
- 949D9B
- 8E9392
- 878A89
Renk uyumları
Tamamlayıcı +180°
- C5E5DD
Touch of Frost
- F2D4DC
≈ Priscilla
Analog -30° +30°
- C5E5DD
Touch of Frost
- CEE4D0
≈ Lime Flip
- C3E4E9
≈ Touched by the Sea
Üçlü +120° +240°
- C5E5DD
Touch of Frost
- DFD8F2
≈ Lavender Sky
- EFD8C6
≈ Hen of the Woods
Bölünmüş tamamlayıcı +150° +210°
- C5E5DD
Touch of Frost
- EBD5E9
≈ First Lilac
- F4D5D0
≈ French Bustle
Dörtlü +90° +180° +270°
- C5E5DD
Touch of Frost
- D3DDF5
≈ Puffy Cloud
- F2D4DC
≈ Priscilla
- E6DCC3
≈ Natural Radiance
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.34:1 · APCA Lc 17
Ag
AAASiyah üzerinde
WCAG 15.62:1 · APCA Lc 87
En iyi metin rengi: #000000
WCAG 15.62:1 (AAA) · APCA Lc 87
Contrast pairs
Kod parçacıkları
CSS
:root {
--touch-of-frost: #c5e5dd;
--touch-of-frost-rgb: 197 229 221;
--touch-of-frost-oklch: oklch(0.896 0.035 178.7);
}
.element {
color: var(--touch-of-frost);
background-color: hsl(165 38% 84%);
border-color: oklch(0.896 0.035 178.7);
}Tailwind CSS v4
@theme {
--color-touch-of-frost: #c5e5dd;
--color-touch-of-frost-50: #ebf9f5;
--color-touch-of-frost-100: #dcece8;
--color-touch-of-frost-200: #c5d9d5;
--color-touch-of-frost-300: #a5beb8;
--color-touch-of-frost-400: #89a69f;
--color-touch-of-frost-500: #6d8e86;
--color-touch-of-frost-600: #5d7872;
--color-touch-of-frost-700: #4a605b;
--color-touch-of-frost-800: #364742;
--color-touch-of-frost-900: #25312e;
--color-touch-of-frost-950: #131d1a;
}SCSS
$touch-of-frost: #c5e5dd;
$touch-of-frost-rgb: 197, 229, 221;
$touch-of-frost-light: mix(#fff, $touch-of-frost, 20%);
$touch-of-frost-dark: mix(#000, $touch-of-frost, 20%);
.element {
color: $touch-of-frost;
box-shadow: 0 0 0 2px rgba($touch-of-frost, 0.35);
}