命名颜色 · #B8FFEB
Peppermint Frosting
Peppermint Frosting 即 #B8FFEB：rgb(184 255 235)、hsl(163 100% 86%)、oklch(0.948 0.075 175.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Teal mean? → · Peppermint Frosting color name →
#B8FFEB
oklch(0.948 0.075 175.2)
颜色转换
- 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%)
浅色调 · 深色调 · 灰色调
浅色调
- C0FFED
- C7FFEF
- CFFFF1
- D6FFF3
- DDFFF5
- E4FFF7
- EBFFF9
- F2FFFB
- F8FFFD
深色调
- A0DECC
- 88BEAE
- 719E91
- 5B8075
- 45635B
- 314841
- 1E2E29
- 0C1613
- 020303
灰色调
- B3F2E0
- AEE4D5
- A8D7CA
- A3CBBF
- 9DBEB4
- 98B1A9
- 92A59F
- 8C9894
- 868C8A
配色和谐
互补色 +180°
- B8FFEB
Peppermint Frosting
- FFE6EE
≈ Early Blossom
类似色 -30° +30°
- B8FFEB
Peppermint Frosting
- CFFCCF
≈ Distilled Moss
- C5F9FF
≈ Friendly Frost
三角配色 +120° +240°
- B8FFEB
Peppermint Frosting
- EFEAFF
≈ Placebo Purple
- FFE9DB
≈ Guiding Star
分裂互补色 +150° +210°
- B8FFEB
Peppermint Frosting
- FEE4FF
≈ Fairy Salt
- FFE7E5
≈ Pink Theory
四角配色 +90° +180° +270°
- B8FFEB
Peppermint Frosting
- E6EEFF
≈ Brilliant White
- FFE6EE
≈ Early Blossom
- FFECC4
≈ Yoghurt
对比度与无障碍
Ag
Fail白底
WCAG 1.13:1 · APCA Lc 0
Ag
AAA黑底
WCAG 18.54:1 · APCA Lc 99
最佳文字颜色: #000000
WCAG 18.54:1 (AAA) · APCA Lc 99
Contrast pairs
代码片段
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);
}