色名 · #CAC0B0
Beach Woods
Beach Woodsは#CAC0B0：rgb(202 192 176)、hsl(37 20% 74%)、oklch(0.812 0.025 79.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Beach Woods color name →
#CAC0B0
oklch(0.812 0.025 79.7)
カラー変換
- HEX
- #cac0b0
- RGB
- rgb(202 192 176)
- HSL
- hsl(37 20% 74%)
- HWB
- hwb(37 69% 21%)
- OKLCH
- oklch(0.812 0.025 79.7)
- OKLab
- oklab(0.812 0.004 0.024)
- CIE Lab
- lab(78.2 1.62 9.42)
- LCH
- lch(78.2 9.56 80.2)
- CMYK
- cmyk(0% 5% 13% 21%)
ティント · シェード · トーン
ティント
- CFC6B8
- D4CCBF
- DAD3C7
- DFD9CF
- E4DFD7
- EAE5DF
- EFECE7
- F4F2EF
- FAF9F7
シェード
- AFA799
- 958E82
- 7C766C
- 645F56
- 4D4942
- 37342E
- 22201C
- 0F0E0B
- 020201
トーン
- C2B9AB
- BBB3A6
- B3ACA1
- ACA69D
- A49F98
- 9D9993
- 96938E
- 8E8C89
- 878685
カラーハーモニー
補色 +180°
- CAC0B0
Beach Woods
- B8C2D2
≈ Pageant Song
類似色 -30° +30°
- CAC0B0
Beach Woods
- CFBDB4
≈ Smokey Pink
- C2C3B1
≈ Moonshine
トライアド +120° +240°
- CAC0B0
Beach Woods
- B0C7C8
≈ Restful Retreat
- C9BDCC
≈ My Mona
スプリットコンプリメンタリー +150° +210°
- CAC0B0
Beach Woods
- B2C5CE
≈ Blue Luna
- C1BFD1
≈ Silver Dagger
テトラード +90° +180° +270°
- CAC0B0
Beach Woods
- B3C7BF
≈ Fresh Tone
- B8C2D2
≈ Pageant Song
- CFBBC4
≈ Rose Marble
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.79:1 · APCA Lc 33
Ag
AAA黒の上
WCAG 11.67:1 · APCA Lc 69
最適な文字色: #000000
WCAG 11.67:1 (AAA) · APCA Lc 69
Contrast pairs
コードスニペット
CSS
:root {
--beach-woods: #cac0b0;
--beach-woods-rgb: 202 192 176;
--beach-woods-oklch: oklch(0.812 0.025 79.7);
}
.element {
color: var(--beach-woods);
background-color: hsl(37 20% 74%);
border-color: oklch(0.812 0.025 79.7);
}Tailwind CSS v4
@theme {
--color-beach-woods: #cac0b0;
--color-beach-woods-50: #f9f5ed;
--color-beach-woods-100: #ece7df;
--color-beach-woods-200: #dad3c9;
--color-beach-woods-300: #beb6aa;
--color-beach-woods-400: #a69d8e;
--color-beach-woods-500: #8f8574;
--color-beach-woods-600: #797062;
--color-beach-woods-700: #615a4f;
--color-beach-woods-800: #474139;
--color-beach-woods-900: #312d27;
--color-beach-woods-950: #1d1a15;
}SCSS
$beach-woods: #cac0b0;
$beach-woods-rgb: 202, 192, 176;
$beach-woods-light: mix(#fff, $beach-woods, 20%);
$beach-woods-dark: mix(#000, $beach-woods, 20%);
.element {
color: $beach-woods;
box-shadow: 0 0 0 2px rgba($beach-woods, 0.35);
}