Adlandırılmış renk · #B8FFEB
Peppermint Frosting
Peppermint Frosting, #B8FFEB: rgb(184 255 235), hsl(163 100% 86%), oklch(0.948 0.075 175.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Teal mean? → · Peppermint Frosting color name →
#B8FFEB
oklch(0.948 0.075 175.2)
Renk dönüşümleri
- HEX
- #b8ffeb
- RGB
- rgb(184 255 235)
- HSL
- hsl(163 100% 86%)
- HWB
- hwb(163 72% 0%)
- OKLCH
- oklch(0.948 0.075 175.2)
- OKLab
- oklab(0.948 -0.075 0.006)
- CIE Lab
- lab(94.9 -25.89 2.15)
- LCH
- lch(94.9 25.98 175.3)
- CMYK
- cmyk(28% 0% 8% 0%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- C0FFED
- C7FFEF
- CFFFF1
- D6FFF3
- DDFFF5
- E4FFF7
- EBFFF9
- F2FFFB
- F8FFFD
Koyu tonlar
- A0DECC
- 88BEAE
- 719E91
- 5B8075
- 45635B
- 314841
- 1E2E29
- 0C1613
- 020303
Gri tonlar
- B3F2E0
- AEE4D5
- A8D7CA
- A3CBBF
- 9DBEB4
- 98B1A9
- 92A59F
- 8C9894
- 868C8A
Renk uyumları
Tamamlayıcı +180°
- B8FFEB
Peppermint Frosting
- FFE6EE
≈ Early Blossom
Analog -30° +30°
- B8FFEB
Peppermint Frosting
- CFFCCF
≈ Distilled Moss
- C5F9FF
≈ Friendly Frost
Üçlü +120° +240°
- B8FFEB
Peppermint Frosting
- EFEAFF
≈ Placebo Purple
- FFE9DB
≈ Guiding Star
Bölünmüş tamamlayıcı +150° +210°
- B8FFEB
Peppermint Frosting
- FEE4FF
≈ Fairy Salt
- FFE7E5
≈ Pink Theory
Dörtlü +90° +180° +270°
- B8FFEB
Peppermint Frosting
- E6EEFF
≈ Brilliant White
- FFE6EE
≈ Early Blossom
- FFECC4
≈ Yoghurt
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.13:1 · APCA Lc 0
Ag
AAASiyah üzerinde
WCAG 18.54:1 · APCA Lc 99
En iyi metin rengi: #000000
WCAG 18.54:1 (AAA) · APCA Lc 99
Contrast pairs
Kod parçacıkları
CSS
:root {
--peppermint-frosting: #b8ffeb;
--peppermint-frosting-rgb: 184 255 235;
--peppermint-frosting-oklch: oklch(0.948 0.075 175.2);
}
.element {
color: var(--peppermint-frosting);
background-color: hsl(163 100% 86%);
border-color: oklch(0.948 0.075 175.2);
}Tailwind CSS v4
@theme {
--color-peppermint-frosting: #b8ffeb;
--color-peppermint-frosting-50: #e0fdf5;
--color-peppermint-frosting-100: #cef1e7;
--color-peppermint-frosting-200: #b3dfd4;
--color-peppermint-frosting-300: #8ec5b7;
--color-peppermint-frosting-400: #6dad9c;
--color-peppermint-frosting-500: #499783;
--color-peppermint-frosting-600: #3f7f6f;
--color-peppermint-frosting-700: #326659;
--color-peppermint-frosting-800: #244b40;
--color-peppermint-frosting-900: #18342c;
--color-peppermint-frosting-950: #081f19;
}SCSS
$peppermint-frosting: #b8ffeb;
$peppermint-frosting-rgb: 184, 255, 235;
$peppermint-frosting-light: mix(#fff, $peppermint-frosting, 20%);
$peppermint-frosting-dark: mix(#000, $peppermint-frosting, 20%);
.element {
color: $peppermint-frosting;
box-shadow: 0 0 0 2px rgba($peppermint-frosting, 0.35);
}