#48BF78 - #E5E6B0 | colorate

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

Blend #48BF78 to #E5E6B0

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

RGBブレンド

#48BF78 - #E5E6B0 | colorate

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

0.0%	0.0% #48BF78	RGB 72 191 120	#48BF78
16.7%	16.7% #62C581	RGB 98 197 129	#62C581
33.3%	33.3% #7CCC8A	RGB 124 204 138	#7CCC8A
50.0%	50.0% #96D294	RGB 150 210 148	#96D294
66.7%	66.7% #B0D99D	RGB 176 217 157	#B0D99D
83.3%	83.3% #CADFA6	RGB 202 223 166	#CADFA6
100.0%	100.0% #E5E6B0	RGB 229 230 176	#E5E6B0

#48BF78 #62C581 #7CCC8A #96D294 #B0D99D #CADFA6 #E5E6B0

#48BF78 - #E5E6B0

HSVブレンド

#48BF78 - #E5E6B0 | colorate

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

0.0%	0.0% #48BF78	RGB 72 191 120	#48BF78
16.7%	16.7% #57C56A	RGB 87 197 106	#57C56A
33.3%	33.3% #6DCC67	RGB 109 204 103	#6DCC67
50.0%	50.0% #92D278	RGB 146 210 120	#92D278
66.7%	66.7% #B3D989	RGB 179 217 137	#B3D989
83.3%	83.3% #CEDF9C	RGB 206 223 156	#CEDF9C
100.0%	100.0% #E5E6B0	RGB 229 230 176	#E5E6B0

#48BF78 #57C56A #6DCC67 #92D278 #B3D989 #CEDF9C #E5E6B0

#48BF78 - #92D278 - #E5E6B0

CSSコード

<style type="text/css">
/* RGB Gradient */
div {
    background: -moz-linear-gradient(top, #48BF78 0%, #E5E6B0 100%);
    background: -webkit-linear-gradient(top, #48BF78 0%, #E5E6B0 100%);
    background: linear-gradient(to bottom, #48BF78 0%, #E5E6B0 100%);
}

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #48BF78 0%, #92D278 50%, #E5E6B0 100%);
    background: -webkit-linear-gradient(top, #48BF78 0%, #92D278 50%, #E5E6B0 100%);
    background: linear-gradient(to bottom, #48BF78 0%, #92D278 50%, #E5E6B0 100%);
}
</style>