色名 · #BCCAB3
Bok Choy
Bok Choyは#BCCAB3：rgb(188 202 179)、hsl(97 18% 75%)、oklch(0.822 0.035 133)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Green mean? → · Bok Choy color name →
#BCCAB3
oklch(0.822 0.035 133)
カラー変換
- HEX
- #bccab3
- RGB
- rgb(188 202 179)
- HSL
- hsl(97 18% 75%)
- HWB
- hwb(97 70% 21%)
- OKLCH
- oklch(0.822 0.035 133)
- OKLab
- oklab(0.822 -0.024 0.026)
- CIE Lab
- lab(79.76 -8.09 9.82)
- LCH
- lch(79.76 12.72 129.5)
- CMYK
- cmyk(7% 0% 11% 21%)
ティント · シェード · トーン
ティント
- C3CFBA
- C9D4C2
- D0DAC9
- D6DFD1
- DDE4D9
- E4EAE0
- EBEFE8
- F1F4EF
- F8FAF7
シェード
- A3AF9B
- 8B9584
- 737C6E
- 5D6458
- 474D43
- 32372F
- 1F221D
- 0D0F0C
- 020201
トーン
- B6C2AE
- B0BBA9
- AAB3A3
- A4AC9E
- 9EA499
- 989D94
- 92968F
- 8C8E8A
- 868785
カラーハーモニー
補色 +180°
- BCCAB3
Bok Choy
- CDBFD5
≈ Awesome Aura
類似色 -30° +30°
- BCCAB3
Bok Choy
- C8C6AC
≈ Tame Thyme
- B1CCBE
≈ Sweet Mint
トライアド +120° +240°
- BCCAB3
Bok Choy
- B5C7DC
≈ Blue Ballerina
- DBBCBE
≈ Shy Smile
スプリットコンプリメンタリー +150° +210°
- BCCAB3
Bok Choy
- C1C2DB
≈ Lavender Sachet
- D6BCCB
≈ Noteworthy
テトラード +90° +180° +270°
- BCCAB3
Bok Choy
- ADCAD5
≈ Sea Wind
- CDBFD5
≈ Awesome Aura
- DABEB3
≈ Peach Blush
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.71:1 · APCA Lc 31
Ag
AAA黒の上
WCAG 12.23:1 · APCA Lc 72
最適な文字色: #000000
WCAG 12.23:1 (AAA) · APCA Lc 72
Contrast pairs
コードスニペット
CSS
:root {
--bok-choy: #bccab3;
--bok-choy-rgb: 188 202 179;
--bok-choy-oklch: oklch(0.822 0.035 133);
}
.element {
color: var(--bok-choy);
background-color: hsl(97 18% 75%);
border-color: oklch(0.822 0.035 133);
}Tailwind CSS v4
@theme {
--color-bok-choy: #bccab3;
--color-bok-choy-50: #f1f8ee;
--color-bok-choy-100: #e3ebdf;
--color-bok-choy-200: #ced8c9;
--color-bok-choy-300: #b0bcaa;
--color-bok-choy-400: #96a38e;
--color-bok-choy-500: #7d8c74;
--color-bok-choy-600: #6a7662;
--color-bok-choy-700: #555e4e;
--color-bok-choy-800: #3e4538;
--color-bok-choy-900: #2b3027;
--color-bok-choy-950: #181c15;
}SCSS
$bok-choy: #bccab3;
$bok-choy-rgb: 188, 202, 179;
$bok-choy-light: mix(#fff, $bok-choy, 20%);
$bok-choy-dark: mix(#000, $bok-choy, 20%);
.element {
color: $bok-choy;
box-shadow: 0 0 0 2px rgba($bok-choy, 0.35);
}