色名 · #807A55
Meadowland
Meadowlandは#807A55：rgb(128 122 85)、hsl(52 20% 42%)、oklch(0.575 0.053 100.1)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Meadowland color name →
#807A55
oklch(0.575 0.053 100.1)
カラー変換
- HEX
- #807a55
- RGB
- rgb(128 122 85)
- HSL
- hsl(52 20% 42%)
- HWB
- hwb(52 33% 50%)
- OKLCH
- oklch(0.575 0.053 100.1)
- OKLab
- oklab(0.575 -0.009 0.053)
- CIE Lab
- lab(51.04 -2.12 21.19)
- LCH
- lch(51.04 21.29 95.7)
- CMYK
- cmyk(0% 5% 34% 50%)
ティント · シェード · トーン
ティント
- 8C8765
- 989375
- A4A086
- B1AD96
- BDBBA7
- CAC8B8
- D7D5CA
- E4E3DB
- F2F1ED
シェード
- 6E6949
- 5D593D
- 4D4931
- 3D3A26
- 2E2B1C
- 1F1D11
- 121008
- 060502
- 010100
トーン
- 807B5A
- 807B5E
- 807C63
- 807D67
- 807D6B
- 807E6F
- 807E74
- 807F78
- 807F7C
カラーハーモニー
補色 +180°
- 807A55
Meadowland
- 727699
≈ Kimono Violet
類似色 -30° +30°
- 807A55
Meadowland
- 8E7456
≈ Library Oak
- 6E805E
≈ Emerald City
トライアド +120° +240°
- 807A55
Meadowland
- 54818F
≈ Cape Lee
- 8F6D83
≈ Dianthus Mauve
スプリットコンプリメンタリー +150° +210°
- 807A55
Meadowland
- 617C98
≈ Indigo Dreams
- 837091
≈ Provence Violet
テトラード +90° +180° +270°
- 807A55
Meadowland
- 528380
≈ Rainier Blue
- 727699
≈ Kimono Violet
- 966C72
≈ Victorian Rose
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 4.34:1 · APCA Lc 70
Ag
AA黒の上
WCAG 4.83:1 · APCA Lc 32
最適な文字色: #000000
WCAG 4.83:1 (AA) · APCA Lc 32
Contrast pairs
コードスニペット
CSS
:root {
--meadowland: #807a55;
--meadowland-rgb: 128 122 85;
--meadowland-oklch: oklch(0.575 0.053 100.1);
}
.element {
color: var(--meadowland);
background-color: hsl(52 20% 42%);
border-color: oklch(0.575 0.053 100.1);
}Tailwind CSS v4
@theme {
--color-meadowland: #807a55;
--color-meadowland-50: #f8f6e5;
--color-meadowland-100: #ebe9d5;
--color-meadowland-200: #d8d6bc;
--color-meadowland-300: #bcb99a;
--color-meadowland-400: #a5a07b;
--color-meadowland-500: #8e875e;
--color-meadowland-600: #787350;
--color-meadowland-700: #605c40;
--color-meadowland-800: #47432d;
--color-meadowland-900: #312e1e;
--color-meadowland-950: #1d1b0e;
}SCSS
$meadowland: #807a55;
$meadowland-rgb: 128, 122, 85;
$meadowland-light: mix(#fff, $meadowland, 20%);
$meadowland-dark: mix(#000, $meadowland, 20%);
.element {
color: $meadowland;
box-shadow: 0 0 0 2px rgba($meadowland, 0.35);
}