ColorTool
ログイン
#30BB03

#30bb03 ≈ Kelly Green

  • 緑
  • 明度: 低い
  • 彩度: 高め
  • 中間色
コントラストを確認 グラフで探索 ランダムな色

#30bb03は緑系の色です（明度：低い、彩度：高め）。 RGBでは赤18.82%、緑73.33%、青1.18%で構成され、CMYK印刷ではシアン74.33%、マゼンタ0%、イエロー98.4%、ブラック26.67%を使います。 HSLでは色相角105.33°、彩度96.84%、明度37.25%です。 暖色と寒色の中間で、自然、健康、調和を連想させることが多い色です。 デザインでは主にエコブランド、健康・ウェルネス、CTAボタンに使われます。 この色の上に黒の文字を置くとコントラスト比は8.24:1（WCAG AAA）です。 最も近い色名はKelly Green（#4cbb17）で、ΔEは1.75です。

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

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

補色

  1. #30bb03
  2. #8e03bb

分裂補色

  1. #30bb03
  2. #3203bb
  3. #bb038c

類似色

  1. #8cbb03
  2. #30bb03
  3. #03bb32

トライアド

  1. #30bb03
  2. #0330bb
  3. #bb0330

テトラード

  1. #30bb03
  2. #03bb8e
  3. #8e03bb
  4. #bb0330

スクエア

  1. #30bb03
  2. #038cbb
  3. #8e03bb
  4. #bb3203

モノクロマティック

  1. #092401
  2. #1d7002
  3. #30bb03
  4. #49fb0f
  5. #82fc5b

シェード

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

  1. #30bb03
  2. #2ba803
  3. #269602
  4. #228302
  5. #1d7002
  6. #185e02
  7. #134b01
  8. #0e3801
  9. #0a2501
  10. #051300
  11. #000000

ティント

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

  1. #30bb03
  2. #45c21c
  3. #59c935
  4. #6ecf4f
  5. #83d668
  6. #98dd81
  7. #ace49a
  8. #c1ebb3
  9. #d6f1cd
  10. #eaf8e6
  11. #ffffff

トーン

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

  1. #30bb03
  2. #38b510
  3. #40af1c
  4. #48a929
  5. #50a335
  6. #589e42
  7. #60984e
  8. #68925b
  9. #708c67
  10. #788674
  11. #808080

読みやすい文字 2.55:1 AA ✕ AA Large ✕ AAA ✕ AAA Large ✕
読みやすい文字 8.24:1 AA ✓ AA Large ✓ AAA ✓ AAA Large ✓

1色覚（全色盲） #a2a2a2 男性の約0.003%
不完全1色覚 #84ad80 男性の約0.001%
1型2色覚（P型） #c0a900 男性の約1.01%
2型2色覚（D型） #b19e29 男性の約1.27%
3型2色覚（T型） #00b59e 男性の約0.0001%
1型3色覚（P型弱） #9bb000 男性の約1.08%
2型3色覚（D型弱） #8faa1f 男性の約4.63%
3型3色覚（T型弱） #1bb77d 男性の約0.0002%
自分の画像でシミュレーション

この色の文字

この色の背景

この色の枠線

文字色
.text-30bb03 {
  color: #30bb03;
}
背景色
.bg-30bb03 {
  background-color: #30bb03;
  color: #000000;
}
枠線
.border-30bb03 {
  border: 2px solid #30bb03;
}
CSS変数
:root {
  --color-primary: #30bb03;
  --color-primary-rgb: 48 187 3;
  --color-primary-hsl: 105 97% 37%;
}
グラデーション
.gradient-30bb03 {
  background: linear-gradient(135deg, #30bb03, #03bb32);
}
色付きの影
.shadow-30bb03 {
  box-shadow: 0 8px 24px rgb(48 187 3 / 0.35);
}

#4cbb17 Kelly Green ΔE 1.75 #32cd32 Lime Green ΔE 5.03 #74c365 Mantis ΔE 8.93 #0bda51 Malachite ΔE 9.07 #8db600 Apple Green ΔE 11.05 #9acd32 Yellow Green ΔE 11.58 #50c878 Emerald ΔE 11.59 #cf44fc 反転色 #a2a2a2 グレースケール 

Kelly Green
#30bb03  rgb(48, 187, 3)  hsl(105, 97%, 37%)  Kelly Green
#8e03bb  rgb(142, 3, 187)  hsl(285, 97%, 37%)  Dark Violet
#0330bb  rgb(3, 48, 187)  hsl(225, 97%, 37%)  Persian Blue
#bb0330  rgb(187, 3, 48)  hsl(345, 97%, 37%)  Cardinal