色名 · #575654

Jet Fuel

Jet Fuelは#575654：rgb(87 86 84)、hsl(40 2% 34%)、oklch(0.453 0.003 84.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。

What does Gray mean? → · Jet Fuel color name →

#575654

oklch(0.453 0.003 84.6)

カラー変換

HEX: #575654
RGB: rgb(87 86 84)
HSL: hsl(40 2% 34%)
HWB: hwb(40 33% 66%)
OKLCH: oklch(0.453 0.003 84.6)
OKLab: oklab(0.453 0 0.003)
CIE Lab: lab(36.61 0.11 1.32)
LCH: lch(36.61 1.32 85.4)
CMYK: cmyk(0% 1% 3% 66%)

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

ティント

666563
767573
868584
969694
A7A6A5
B8B8B7
C9C9C8
DBDBDA
EDEDEC

シェード

4B4A48
3E3E3C
333231
272726
1C1C1B
121211
080808
030202
000000

トーン

5B5A58
5F5E5D
636261
676665
6B6B6A
6F6F6E
737372
787777
7C7C7B

カラーハーモニー

補色 +180°

575654
Jet Fuel
555658
≈ Orion Grey

類似色 -30° +30°

トライアド +120° +240°

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

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

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

白の上

WCAG 7.33:1 · APCA Lc 85

AAA

黒の上

WCAG 2.86:1 · APCA Lc 17

Fail

最適な文字色: #FFFFFF

WCAG 7.33:1 (AAA) · APCA Lc 85

Contrast pairs

コードスニペット

CSS

:root {
  --jet-fuel: #575654;
  --jet-fuel-rgb: 87 86 84;
  --jet-fuel-oklch: oklch(0.453 0.003 84.6);
}

.element {
  color: var(--jet-fuel);
  background-color: hsl(40 2% 34%);
  border-color: oklch(0.453 0.003 84.6);
}

Tailwind CSS v4

@theme {
  --color-jet-fuel: #575654;
  --color-jet-fuel-50: #f5f5f4;
  --color-jet-fuel-100: #e8e8e6;
  --color-jet-fuel-200: #d5d4d2;
  --color-jet-fuel-300: #b8b7b5;
  --color-jet-fuel-400: #9f9e9c;
  --color-jet-fuel-500: #878684;
  --color-jet-fuel-600: #72716f;
  --color-jet-fuel-700: #5b5b59;
  --color-jet-fuel-800: #434241;
  --color-jet-fuel-900: #2e2e2d;
  --color-jet-fuel-950: #1b1a1a;
}

SCSS

$jet-fuel: #575654;
$jet-fuel-rgb: 87, 86, 84;
$jet-fuel-light: mix(#fff, $jet-fuel, 20%);
$jet-fuel-dark: mix(#000, $jet-fuel, 20%);

.element {
  color: $jet-fuel;
  box-shadow: 0 0 0 2px rgba($jet-fuel, 0.35);
}

近い色名

Palettes with similar colors

ツールで開く

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