ColorTool
ログイン
#AF482B

#af482b ≈ Rust

  • オレンジ
  • 明度: 中程度
  • 彩度: 高め
  • 暖色
コントラストを確認 グラフで探索 ランダムな色

#af482bはオレンジ系の色です（明度：中程度、彩度：高め）。 RGBでは赤68.63%、緑28.24%、青16.86%で構成され、CMYK印刷ではシアン0%、マゼンタ58.86%、イエロー75.43%、ブラック31.37%を使います。 HSLでは色相角13.18°、彩度60.55%、明度42.75%です。 暖色で、熱意、温かさ、創造性を連想させることが多い色です。 デザインでは主にCTAボタン、食品ブランドやレストラン、ブランドのアクセントに使われます。 この色の上に白の文字を置くとコントラスト比は5.55:1（WCAG AA）です。 最も近い色名はRust（#b7410e）で、ΔEは4.86です。

この色の測定値から自動生成した説明です。

HEX
RGB
RGB（%）
CMY
CMYK
HSL
HSV / HSB
Webセーフ#993333
CIE-LAB
XYZ
xyY
CIE-LCH
CIE-LUV
Hunter-Lab
OKLab
2進数
10進数
相対輝度0.1392

補色

  1. #af482b
  2. #2b92af

分裂補色

  1. #af482b
  2. #2baf8a
  3. #2b50af

類似色

  1. #af2b50
  2. #af482b
  3. #af8a2b

トライアド

  1. #af482b
  2. #2baf48
  3. #482baf

テトラード

  1. #af482b
  2. #92af2b
  3. #2b92af
  4. #482baf

スクエア

  1. #af482b
  2. #50af2b
  3. #2b92af
  4. #8a2baf

モノクロマティック

  1. #34150d
  2. #722f1c
  3. #af482b
  4. #d46f52
  5. #e4a28f

シェード

#af482bに黒を段階的に混ぜた色です。

  1. #af482b
  2. #9e4127
  3. #8c3a22
  4. #7b321e
  5. #692b1a
  6. #582416
  7. #461d11
  8. #35160d
  9. #230e09
  10. #120704
  11. #000000

ティント

#af482bに白を段階的に混ぜた色です。

  1. #af482b
  2. #b75a40
  3. #bf6d55
  4. #c77f6b
  5. #cf9180
  6. #d7a495
  7. #dfb6aa
  8. #e7c8bf
  9. #efdad5
  10. #f7edea
  11. #ffffff

トーン

#af482bにグレーを段階的に混ぜた色です。

  1. #af482b
  2. #aa4e34
  3. #a6533c
  4. #a15945
  5. #9c5e4d
  6. #986456
  7. #936a5e
  8. #8e6f67
  9. #89756f
  10. #857a78
  11. #808080

読みやすい文字 5.55:1 AA ✓ AA Large ✓ AAA ✕ AAA Large ✓
読みやすい文字 3.78:1 AA ✕ AA Large ✓ AAA ✕ AAA Large ✕

1色覚（全色盲） #686868 男性の約0.003%
不完全1色覚 #8a5d56 男性の約0.001%
1型2色覚（P型） #645a27 男性の約1.01%
2型2色覚（D型） #7e7128 男性の約1.27%
3型2色覚（T型） #c03142 男性の約0.0001%
1型3色覚（P型弱） #895329 男性の約1.08%
2型3色覚（D型弱） #946329 男性の約4.63%
3型3色覚（T型弱） #ba3b3a 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-af482b {
  color: #af482b;
}
背景色
.bg-af482b {
  background-color: #af482b;
  color: #ffffff;
}
枠線
.border-af482b {
  border: 2px solid #af482b;
}
CSS変数
:root {
  --color-primary: #af482b;
  --color-primary-rgb: 175 72 43;
  --color-primary-hsl: 13 61% 43%;
}
グラデーション
.gradient-af482b {
  background: linear-gradient(135deg, #af482b, #af8a2b);
}
色付きの影
.shadow-af482b {
  box-shadow: 0 8px 24px rgb(175 72 43 / 0.35);
}

#b7410e Rust ΔE 4.86 #a0522d Sienna ΔE 5.19 #c04000 Mahogany ΔE 6.57 #954535 Chestnut ΔE 6.69 #cb410b Sinopia ΔE 6.88 #b22222 Firebrick ΔE 8.05 #b31b1b Cornell Red ΔE 8.11 #50b7d4 反転色 #686868 グレースケール 

Rust
#af482b  rgb(175, 72, 43)  hsl(13, 61%, 43%)  Rust
#2b92af  rgb(43, 146, 175)  hsl(193, 61%, 43%)  Bondi Blue
#2baf48  rgb(43, 175, 72)  hsl(133, 61%, 43%)  Medium Sea Green
#482baf  rgb(72, 43, 175)  hsl(253, 61%, 43%)  Ocean Blue