色名 · #BFD3CB
Spearmint Ice
Spearmint Iceは#BFD3CB：rgb(191 211 203)、hsl(156 19% 79%)、oklch(0.85 0.024 169.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Spearmint Ice color name →
#BFD3CB
oklch(0.85 0.024 169.8)
カラー変換
- HEX
- #bfd3cb
- RGB
- rgb(191 211 203)
- HSL
- hsl(156 19% 79%)
- HWB
- hwb(156 75% 17%)
- OKLCH
- oklch(0.85 0.024 169.8)
- OKLab
- oklab(0.85 -0.024 0.004)
- CIE Lab
- lab(82.87 -8.12 1.56)
- LCH
- lch(82.87 8.27 169.1)
- CMYK
- cmyk(9% 0% 4% 17%)
ティント · シェード · トーン
ティント
- C5D7D0
- CCDCD5
- D2E0DA
- D8E4E0
- DFE9E5
- E5EDEA
- ECF2EF
- F2F6F4
- F9FBFA
シェード
- A6B7B0
- 8D9C96
- 75827D
- 5E6965
- 48514D
- 333A37
- 1F2422
- 0D100F
- 020202
トーン
- B9CAC3
- B2C2BC
- ACB9B4
- A5B1AC
- 9FA9A5
- 99A09D
- 939896
- 8C908E
- 868887
カラーハーモニー
補色 +180°
- BFD3CB
Spearmint Ice
- DBC8D0
≈ Kellie Belle
類似色 -30° +30°
- BFD3CB
Spearmint Ice
- C6D2C3
≈ Frosted Sage
- BCD3D4
≈ Relax
トライアド +120° +240°
- BFD3CB
Spearmint Ice
- CDCBDD
≈ Lunar Dust
- DBC9C0
≈ Malted
スプリットコンプリメンタリー +150° +210°
- BFD3CB
Spearmint Ice
- D5C9D8
≈ Eternal Moonrise
- DDC8C7
≈ Misty Blush
テトラード +90° +180° +270°
- BFD3CB
Spearmint Ice
- C5CEDE
≈ Lilac Bisque
- DBC8D0
≈ Kellie Belle
- D6CCBC
≈ Tern Grey
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.56:1 · APCA Lc 26
Ag
AAA黒の上
WCAG 13.39:1 · APCA Lc 77
最適な文字色: #000000
WCAG 13.39:1 (AAA) · APCA Lc 77
Contrast pairs
コードスニペット
CSS
:root {
--spearmint-ice: #bfd3cb;
--spearmint-ice-rgb: 191 211 203;
--spearmint-ice-oklch: oklch(0.85 0.024 169.8);
}
.element {
color: var(--spearmint-ice);
background-color: hsl(156 19% 79%);
border-color: oklch(0.85 0.024 169.8);
}Tailwind CSS v4
@theme {
--color-spearmint-ice: #bfd3cb;
--color-spearmint-ice-50: #eff7f4;
--color-spearmint-ice-100: #e0ebe7;
--color-spearmint-ice-200: #cbd8d3;
--color-spearmint-ice-300: #acbcb6;
--color-spearmint-ice-400: #91a39c;
--color-spearmint-ice-500: #778c84;
--color-spearmint-ice-600: #65766f;
--color-spearmint-ice-700: #515f59;
--color-spearmint-ice-800: #3b4541;
--color-spearmint-ice-900: #28302d;
--color-spearmint-ice-950: #161c1a;
}SCSS
$spearmint-ice: #bfd3cb;
$spearmint-ice-rgb: 191, 211, 203;
$spearmint-ice-light: mix(#fff, $spearmint-ice, 20%);
$spearmint-ice-dark: mix(#000, $spearmint-ice, 20%);
.element {
color: $spearmint-ice;
box-shadow: 0 0 0 2px rgba($spearmint-ice, 0.35);
}