#4DAC44 - #2B9240 | colorate

colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。サイトをよりよくする

Tweet

Blend #4DAC44 to #2B9240

#4DAC44

#2B9240

#4DAC44と#2B9240の二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。

RGBブレンド

RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#4DAC44を0%、#2B9240を100%として二色間の色を展開します。

0.0%	0.0% #4DAC44	RGB 77 172 68	#4DAC44
16.7%	16.7% #48A844	RGB 72 168 68	#48A844
33.3%	33.3% #42A443	RGB 66 164 67	#42A443
50.0%	50.0% #3C9F42	RGB 60 159 66	#3C9F42
66.7%	66.7% #379B42	RGB 55 155 66	#379B42
83.3%	83.3% #319741	RGB 49 151 65	#319741
100.0%	100.0% #2B9240	RGB 43 146 64	#2B9240

#4DAC44 #48A844 #42A443 #3C9F42 #379B42 #319741 #2B9240

#4DAC44 - #2B9240

HSVブレンド

HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#4DAC44を0%、#2B9240を100%として二色間の色を展開します。

0.0%	0.0% #4CAC44	RGB 76 172 68	#4CAC44
16.7%	16.7% #43A73F	RGB 67 167 63	#43A73F
33.3%	33.3% #3BA33C	RGB 59 163 60	#3BA33C
50.0%	50.0% #369F3C	RGB 54 159 60	#369F3C
66.7%	66.7% #329A3D	RGB 50 154 61	#329A3D
83.3%	83.3% #2E963E	RGB 46 150 62	#2E963E
100.0%	100.0% #2B9240	RGB 43 146 64	#2B9240

#4CAC44 #43A73F #3BA33C #369F3C #329A3D #2E963E #2B9240

#4CAC44 - #369F3C - #2B9240

CSSコード

<style type="text/css">
/* RGB Gradation */             
div {
    background: -moz-linear-gradient(top, #4DAC44 0%, #2B9240 100%);
    background: -webkit-linear-gradient(top, #4DAC44 0%, #2B9240 100%);
    background: linear-gradient(to bottom, #4DAC44 0%, #2B9240 100%);  
}       

/* HSV Gradation */
div {                
    background: -moz-linear-gradient(top, #4CAC44 0%, #369F3C 50%, #2B9240 100%);
    background: -webkit-linear-gradient(top, #4CAC44 0%, #369F3C 50%, #2B9240 100%);
    background: linear-gradient(to bottom, #4CAC44 0%, #369F3C 50%, #2B9240 100%); 
}
</style>