色名 · #4C433D
Vehicle Body Grey
Vehicle Body Greyは#4C433D：rgb(76 67 61)、hsl(24 11% 27%)、oklch(0.39 0.016 55.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Vehicle Body Grey color name →
#4C433D
oklch(0.39 0.016 55.9)
カラー変換
- HEX
- #4c433d
- RGB
- rgb(76 67 61)
- HSL
- hsl(24 11% 27%)
- HWB
- hwb(24 24% 70%)
- OKLCH
- oklch(0.39 0.016 55.9)
- OKLab
- oklab(0.39 0.009 0.013)
- CIE Lab
- lab(29.2 3.11 5.13)
- LCH
- lch(29.2 6 58.8)
- CMYK
- cmyk(0% 12% 20% 70%)
ティント · シェード · トーン
ティント
- 5C544E
- 6D6560
- 7E7772
- 8F8985
- A19C98
- B3AFAC
- C6C2C0
- D8D6D5
- ECEAEA
シェード
- 413934
- 362F2B
- 2C2622
- 221D1A
- 181412
- 0F0C0A
- 060504
- 020101
- 000000
トーン
- 514943
- 564F4A
- 5B5550
- 605B57
- 66615E
- 6B6764
- 706D6B
- 757372
- 7B7A79
カラーハーモニー
補色 +180°
- 4C433D
Vehicle Body Grey
- 3D474D
≈ Winter Way
類似色 -30° +30°
- 4C433D
Vehicle Body Grey
- 4D4241
≈ Mulch
- 49453C
≈ Whiskey and Wine
トライアド +120° +240°
- 4C433D
Vehicle Body Grey
- 3C4845
≈ Panda Black
- 46434D
≈ Night Grey
スプリットコンプリメンタリー +150° +210°
- 4C433D
Vehicle Body Grey
- 3B4849
≈ Panda Black
- 41454E
≈ Alpine Duck Grey
テトラード +90° +180° +270°
- 4C433D
Vehicle Body Grey
- 404740
≈ Rich Olive
- 3D474D
≈ Winter Way
- 4A424A
≈ Spinel Grey
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 9.64:1 · APCA Lc 92
Ag
Fail黒の上
WCAG 2.17:1 · APCA Lc 10
最適な文字色: #FFFFFF
WCAG 9.64:1 (AAA) · APCA Lc 92
Contrast pairs
コードスニペット
CSS
:root {
--vehicle-body-grey: #4c433d;
--vehicle-body-grey-rgb: 76 67 61;
--vehicle-body-grey-oklch: oklch(0.39 0.016 55.9);
}
.element {
color: var(--vehicle-body-grey);
background-color: hsl(24 11% 27%);
border-color: oklch(0.39 0.016 55.9);
}Tailwind CSS v4
@theme {
--color-vehicle-body-grey: #4c433d;
--color-vehicle-body-grey-50: #f9f4f1;
--color-vehicle-body-grey-100: #ece7e3;
--color-vehicle-body-grey-200: #dad3ce;
--color-vehicle-body-grey-300: #beb6b0;
--color-vehicle-body-grey-400: #a69c96;
--color-vehicle-body-grey-500: #8f847c;
--color-vehicle-body-grey-600: #796f69;
--color-vehicle-body-grey-700: #615954;
--color-vehicle-body-grey-800: #47413d;
--color-vehicle-body-grey-900: #312d2a;
--color-vehicle-body-grey-950: #1d1a18;
}SCSS
$vehicle-body-grey: #4c433d;
$vehicle-body-grey-rgb: 76, 67, 61;
$vehicle-body-grey-light: mix(#fff, $vehicle-body-grey, 20%);
$vehicle-body-grey-dark: mix(#000, $vehicle-body-grey, 20%);
.element {
color: $vehicle-body-grey;
box-shadow: 0 0 0 2px rgba($vehicle-body-grey, 0.35);
}