色名 · #4F4037
Paco
Pacoは#4F4037：rgb(79 64 55)、hsl(22 18% 26%)、oklch(0.385 0.026 52.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Paco color name →
#4F4037
oklch(0.385 0.026 52.7)
カラー変換
- HEX
- #4f4037
- RGB
- rgb(79 64 55)
- HSL
- hsl(22 18% 26%)
- HWB
- hwb(22 22% 69%)
- OKLCH
- oklch(0.385 0.026 52.7)
- OKLab
- oklab(0.385 0.016 0.02)
- CIE Lab
- lab(28.5 5.54 8.09)
- LCH
- lch(28.5 9.81 55.6)
- CMYK
- cmyk(0% 19% 30% 69%)
ティント · シェード · トーン
ティント
- 5F5149
- 6F625B
- 80746E
- 918781
- A39A95
- B5ADA9
- C7C1BE
- D9D6D3
- ECEAE9
シェード
- 44362E
- 382D26
- 2E241E
- 231B16
- 19130F
- 100B08
- 070503
- 020101
- 000000
トーン
- 54463E
- 594C45
- 5E524C
- 625953
- 675F5A
- 6C6662
- 716C69
- 767371
- 7B7978
カラーハーモニー
補色 +180°
- 4F4037
Paco
- 36464F
≈ Azul Petróleo
類似色 -30° +30°
- 4F4037
Paco
- 513E3D
≈ Magenta Ink
- 4A4334
≈ Cannon Ball
トライアド +120° +240°
スプリットコンプリメンタリー +150° +210°
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 9.90:1 · APCA Lc 93
Ag
Fail黒の上
WCAG 2.12:1 · APCA Lc 10
最適な文字色: #FFFFFF
WCAG 9.90:1 (AAA) · APCA Lc 93
Contrast pairs
コードスニペット
CSS
:root {
--paco: #4f4037;
--paco-rgb: 79 64 55;
--paco-oklch: oklch(0.385 0.026 52.7);
}
.element {
color: var(--paco);
background-color: hsl(22 18% 26%);
border-color: oklch(0.385 0.026 52.7);
}Tailwind CSS v4
@theme {
--color-paco: #4f4037;
--color-paco-50: #fbf3ee;
--color-paco-100: #efe6e0;
--color-paco-200: #ddd2ca;
--color-paco-300: #c2b4ab;
--color-paco-400: #ab9b91;
--color-paco-500: #958277;
--color-paco-600: #7e6e65;
--color-paco-700: #655850;
--color-paco-800: #4a403a;
--color-paco-900: #332c28;
--color-paco-950: #1f1916;
}SCSS
$paco: #4f4037;
$paco-rgb: 79, 64, 55;
$paco-light: mix(#fff, $paco, 20%);
$paco-dark: mix(#000, $paco, 20%);
.element {
color: $paco;
box-shadow: 0 0 0 2px rgba($paco, 0.35);
}