色名 · #4F666A
Sumatra Chicken
Sumatra Chickenは#4F666A：rgb(79 102 106)、hsl(189 15% 36%)、oklch(0.493 0.028 209.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Sumatra Chicken color name →
#4F666A
oklch(0.493 0.028 209.3)
カラー変換
- HEX
- #4f666a
- RGB
- rgb(79 102 106)
- HSL
- hsl(189 15% 36%)
- HWB
- hwb(189 31% 58%)
- OKLCH
- oklch(0.493 0.028 209.3)
- OKLab
- oklab(0.493 -0.025 -0.014)
- CIE Lab
- lab(41.44 -8.13 -5.24)
- LCH
- lch(41.44 9.67 212.8)
- CMYK
- cmyk(25% 4% 0% 58%)
ティント · シェード · トーン
ティント
- 5F7478
- 708386
- 819194
- 92A0A3
- A3AFB2
- B5BFC1
- C7CFD0
- D9DFDF
- ECEFEF
シェード
- 44585B
- 384A4D
- 2E3C3F
- 232F31
- 192324
- 101718
- 070C0D
- 020404
- 000000
トーン
- 54696C
- 596B6E
- 5E6E71
- 637073
- 687375
- 6C7677
- 717879
- 767B7C
- 7B7D7E
カラーハーモニー
補色 +180°
- 4F666A
Sumatra Chicken
- 715C58
≈ Missing Link
類似色 -30° +30°
- 4F666A
Sumatra Chicken
- 506762
≈ Armada
- 536470
≈ Slate
トライアド +120° +240°
- 4F666A
Sumatra Chicken
- 6B5C69
≈ Patina Violet
- 68614F
≈ Ivy Topiary
スプリットコンプリメンタリー +150° +210°
- 4F666A
Sumatra Chicken
- 6F5B61
≈ Poetry Plum
- 6E5E52
≈ Swiss Brown
テトラード +90° +180° +270°
- 4F666A
Sumatra Chicken
- 635E6F
≈ Sedona Shadow
- 715C58
≈ Missing Link
- 5F6452
≈ Cypress Vine
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 6.10:1 · APCA Lc 80
Ag
Fail黒の上
WCAG 3.44:1 · APCA Lc 21
最適な文字色: #FFFFFF
WCAG 6.10:1 (AA) · APCA Lc 80
Contrast pairs
コードスニペット
CSS
:root {
--sumatra-chicken: #4f666a;
--sumatra-chicken-rgb: 79 102 106;
--sumatra-chicken-oklch: oklch(0.493 0.028 209.3);
}
.element {
color: var(--sumatra-chicken);
background-color: hsl(189 15% 36%);
border-color: oklch(0.493 0.028 209.3);
}Tailwind CSS v4
@theme {
--color-sumatra-chicken: #4f666a;
--color-sumatra-chicken-50: #edf7fa;
--color-sumatra-chicken-100: #deebed;
--color-sumatra-chicken-200: #c7d8db;
--color-sumatra-chicken-300: #a8bcc0;
--color-sumatra-chicken-400: #8ca3a7;
--color-sumatra-chicken-500: #718c90;
--color-sumatra-chicken-600: #60767a;
--color-sumatra-chicken-700: #4d5f62;
--color-sumatra-chicken-800: #374547;
--color-sumatra-chicken-900: #263031;
--color-sumatra-chicken-950: #141c1d;
}SCSS
$sumatra-chicken: #4f666a;
$sumatra-chicken-rgb: 79, 102, 106;
$sumatra-chicken-light: mix(#fff, $sumatra-chicken, 20%);
$sumatra-chicken-dark: mix(#000, $sumatra-chicken, 20%);
.element {
color: $sumatra-chicken;
box-shadow: 0 0 0 2px rgba($sumatra-chicken, 0.35);
}