色名 · #DCDDB8
Beach Grass
Beach Grassは#DCDDB8：rgb(220 221 184)、hsl(62 35% 79%)、oklch(0.887 0.049 108.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Beach Grass color name →
#DCDDB8
oklch(0.887 0.049 108.6)
カラー変換
- HEX
- #dcddb8
- RGB
- rgb(220 221 184)
- HSL
- hsl(62 35% 79%)
- HWB
- hwb(62 72% 13%)
- OKLCH
- oklch(0.887 0.049 108.6)
- OKLab
- oklab(0.887 -0.016 0.047)
- CIE Lab
- lab(87.32 -4.9 18.14)
- LCH
- lch(87.32 18.79 105.1)
- CMYK
- cmyk(0% 0% 17% 13%)
ティント · シェード · トーン
ティント
- DFE0BF
- E3E4C6
- E6E7CD
- EAEBD4
- EDEEDB
- F1F1E3
- F4F5EA
- F8F8F1
- FBFCF8
シェード
- BFC0A0
- A3A488
- 888871
- 6E6E5B
- 545545
- 3C3D31
- 26261E
- 11110C
- 020202
トーン
- D2D3B2
- C9CAAD
- BFC0A7
- B6B7A2
- ADAD9C
- A4A496
- 9B9B91
- 92928B
- 898986
カラーハーモニー
補色 +180°
- DCDDB8
Beach Grass
- D8D5F9
≈ Japan Blush
類似色 -30° +30°
- DCDDB8
Beach Grass
- ECD7B6
≈ Sensible Hue
- CAE2C3
≈ Chayote
トライアド +120° +240°
- DCDDB8
Beach Grass
- B9E1F4
≈ Bellagio Fountains
- F4CDDF
≈ Minimal Rose
スプリットコンプリメンタリー +150° +210°
- DCDDB8
Beach Grass
- C7DBFB
≈ Fly a Kite
- E8D0EF
≈ Lavender Princess
テトラード +90° +180° +270°
- DCDDB8
Beach Grass
- B5E4E6
≈ Seascape Green
- D8D5F9
≈ Japan Blush
- F9CECD
≈ Fairy Tale Dream
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.39:1 · APCA Lc 19
Ag
AAA黒の上
WCAG 15.07:1 · APCA Lc 84
最適な文字色: #000000
WCAG 15.07:1 (AAA) · APCA Lc 84
Contrast pairs
コードスニペット
CSS
:root {
--beach-grass: #dcddb8;
--beach-grass-rgb: 220 221 184;
--beach-grass-oklch: oklch(0.887 0.049 108.6);
}
.element {
color: var(--beach-grass);
background-color: hsl(62 35% 79%);
border-color: oklch(0.887 0.049 108.6);
}Tailwind CSS v4
@theme {
--color-beach-grass: #dcddb8;
--color-beach-grass-50: #f5f7e7;
--color-beach-grass-100: #e8ead7;
--color-beach-grass-200: #d5d7bf;
--color-beach-grass-300: #b8ba9e;
--color-beach-grass-400: #a0a180;
--color-beach-grass-500: #898963;
--color-beach-grass-600: #747454;
--color-beach-grass-700: #5c5d43;
--color-beach-grass-800: #444430;
--color-beach-grass-900: #2f2f20;
--color-beach-grass-950: #1c1b10;
}SCSS
$beach-grass: #dcddb8;
$beach-grass-rgb: 220, 221, 184;
$beach-grass-light: mix(#fff, $beach-grass, 20%);
$beach-grass-dark: mix(#000, $beach-grass, 20%);
.element {
color: $beach-grass;
box-shadow: 0 0 0 2px rgba($beach-grass, 0.35);
}