色名 · #454545

Machine Gun Metal

Machine Gun Metalは#454545：rgb(69 69 69)、hsl(0 0% 27%)、oklch(0.39 0 0)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。

What does Gray mean? → · Machine Gun Metal color name →

#454545

oklch(0.39 0 0)

カラー変換

HEX: #454545
RGB: rgb(69 69 69)
HSL: hsl(0 0% 27%)
HWB: hwb(0 27% 73%)
OKLCH: oklch(0.39 0 0)
OKLab: oklab(0.39 0 0)
CIE Lab: lab(29.29 0 0)
LCH: lch(29.29 0 0)
CMYK: cmyk(0% 0% 0% 73%)

ティント · シェード · トーン

ティント

565656
676767
787878
8A8A8A
9D9D9D
B0B0B0
C3C3C3
D7D7D7
EBEBEB

シェード

3B3B3B
313131
272727
1E1E1E
151515
0C0C0C
050505
020202
000000

トーン

4B4B4B
505050
565656
5C5C5C
626262
686868
6E6E6E
747474
7A7A7A

カラーハーモニー

補色 +180°

454545
Machine Gun Metal
454545
≈ Machine Gun Metal

類似色 -30° +30°

トライアド +120° +240°

スプリットコンプリメンタリー +150° +210°

テトラード +90° +180° +270°

コントラストとアクセシビリティ

白の上

WCAG 9.58:1 · APCA Lc 92

AAA

黒の上

WCAG 2.19:1 · APCA Lc 10

Fail

最適な文字色: #FFFFFF

WCAG 9.58:1 (AAA) · APCA Lc 92

Contrast pairs

コードスニペット

CSS

:root {
  --machine-gun-metal: #454545;
  --machine-gun-metal-rgb: 69 69 69;
  --machine-gun-metal-oklch: oklch(0.39 0 0);
}

.element {
  color: var(--machine-gun-metal);
  background-color: hsl(0 0% 27%);
  border-color: oklch(0.39 0 0);
}

Tailwind CSS v4

@theme {
  --color-machine-gun-metal: #454545;
  --color-machine-gun-metal-50: #f5f5f5;
  --color-machine-gun-metal-100: #e8e8e8;
  --color-machine-gun-metal-200: #d4d4d4;
  --color-machine-gun-metal-300: #b7b7b7;
  --color-machine-gun-metal-400: #9e9e9e;
  --color-machine-gun-metal-500: #868686;
  --color-machine-gun-metal-600: #717171;
  --color-machine-gun-metal-700: #5b5b5b;
  --color-machine-gun-metal-800: #424242;
  --color-machine-gun-metal-900: #2e2e2e;
  --color-machine-gun-metal-950: #1b1b1b;
}

SCSS

$machine-gun-metal: #454545;
$machine-gun-metal-rgb: 69, 69, 69;
$machine-gun-metal-light: mix(#fff, $machine-gun-metal, 20%);
$machine-gun-metal-dark: mix(#000, $machine-gun-metal, 20%);

.element {
  color: $machine-gun-metal;
  box-shadow: 0 0 0 2px rgba($machine-gun-metal, 0.35);
}

近い色名

Palettes with similar colors

ツールで開く

ピッカーペアコントラストチェッカー Studio JSON API