Adlandırılmış renk · #81BCA8
Peppermint Bar
Peppermint Bar, #81BCA8: rgb(129 188 168), hsl(160 31% 62%), oklch(0.749 0.068 171.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 Bar color name →
#81BCA8
oklch(0.749 0.068 171.2)
Renk dönüşümleri
- HEX
- #81bca8
- RGB
- rgb(129 188 168)
- HSL
- hsl(160 31% 62%)
- HWB
- hwb(160 51% 26%)
- OKLCH
- oklch(0.749 0.068 171.2)
- OKLab
- oklab(0.749 -0.067 0.01)
- CIE Lab
- lab(71.76 -23.19 3.74)
- LCH
- lch(71.76 23.49 170.8)
- CMYK
- cmyk(31% 0% 11% 26%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 8EC3B0
- 9BC9B9
- A7D0C1
- B4D7CA
- C0DDD3
- CDE4DB
- D9EBE4
- E6F2ED
- F2F8F6
Koyu tonlar
- 6FA392
- 5E8B7C
- 4E7367
- 3E5D52
- 2E473F
- 1F322C
- 121F1A
- 060D0A
- 010201
Gri tonlar
- 82B6A4
- 82B0A0
- 82AA9C
- 82A498
- 829E94
- 829890
- 82928C
- 818C88
- 818684
Renk uyumları
Tamamlayıcı +180°
- 81BCA8
Peppermint Bar
- D09CB3
≈ Quilted Heart
Analog -30° +30°
- 81BCA8
Peppermint Bar
- 96B991
≈ Brookview
- 78BBBF
≈ Aqua Sky
Üçlü +120° +240°
- 81BCA8
Peppermint Bar
- ADA7D6
≈ Ariel’s Delight
- D1A287
≈ Orange Maple
Bölünmüş tamamlayıcı +150° +210°
- 81BCA8
Peppermint Bar
- C2A0C8
≈ Pale Grape
- D59D9B
≈ Savoury Salmon
Dörtlü +90° +180° +270°
- 81BCA8
Peppermint Bar
- 96AFD9
≈ Blue Skies Today
- D09CB3
≈ Quilted Heart
- C4AA7C
≈ Cobbler
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.16:1 · APCA Lc 43
Ag
AAASiyah üzerinde
WCAG 9.69:1 · APCA Lc 60
En iyi metin rengi: #000000
WCAG 9.69:1 (AAA) · APCA Lc 60
Contrast pairs
Kod parçacıkları
CSS
:root {
--peppermint-bar: #81bca8;
--peppermint-bar-rgb: 129 188 168;
--peppermint-bar-oklch: oklch(0.749 0.068 171.2);
}
.element {
color: var(--peppermint-bar);
background-color: hsl(160 31% 62%);
border-color: oklch(0.749 0.068 171.2);
}Tailwind CSS v4
@theme {
--color-peppermint-bar: #81bca8;
--color-peppermint-bar-50: #e3fcf3;
--color-peppermint-bar-100: #d2f0e6;
--color-peppermint-bar-200: #b8ded1;
--color-peppermint-bar-300: #94c3b4;
--color-peppermint-bar-400: #75ac99;
--color-peppermint-bar-500: #549580;
--color-peppermint-bar-600: #487e6d;
--color-peppermint-bar-700: #396557;
--color-peppermint-bar-800: #294a3e;
--color-peppermint-bar-900: #1c332b;
--color-peppermint-bar-950: #0c1f18;
}SCSS
$peppermint-bar: #81bca8;
$peppermint-bar-rgb: 129, 188, 168;
$peppermint-bar-light: mix(#fff, $peppermint-bar, 20%);
$peppermint-bar-dark: mix(#000, $peppermint-bar, 20%);
.element {
color: $peppermint-bar;
box-shadow: 0 0 0 2px rgba($peppermint-bar, 0.35);
}