#5BAE4E - #7CFAAE | colorate

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

Blend #5BAE4E to #7CFAAE

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

RGBブレンド

#5BAE4E - #7CFAAE | colorate

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

0.0%	0.0% #5BAE4E	RGB 91 174 78	#5BAE4E
16.7%	16.7% #60BA5E	RGB 96 186 94	#60BA5E
33.3%	33.3% #66C76E	RGB 102 199 110	#66C76E
50.0%	50.0% #6BD47E	RGB 107 212 126	#6BD47E
66.7%	66.7% #71E08E	RGB 113 224 142	#71E08E
83.3%	83.3% #76ED9E	RGB 118 237 158	#76ED9E
100.0%	100.0% #7CFAAE	RGB 124 250 174	#7CFAAE

#5BAE4E #60BA5E #66C76E #6BD47E #71E08E #76ED9E #7CFAAE

#5BAE4E - #7CFAAE

HSVブレンド

#5BAE4E - #7CFAAE | colorate

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

0.0%	0.0% #5BAE4E	RGB 91 174 78	#5BAE4E
16.7%	16.7% #59BA55	RGB 89 186 85	#59BA55
33.3%	33.3% #5CC761	RGB 92 199 97	#5CC761
50.0%	50.0% #64D472	RGB 100 212 114	#64D472
66.7%	66.7% #6BE085	RGB 107 224 133	#6BE085
83.3%	83.3% #73ED99	RGB 115 237 153	#73ED99
100.0%	100.0% #7CFAAE	RGB 124 250 174	#7CFAAE

#5BAE4E #59BA55 #5CC761 #64D472 #6BE085 #73ED99 #7CFAAE

#5BAE4E - #64D472 - #7CFAAE

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5BAE4E 0%, #64D472 50%, #7CFAAE 100%);
    background: -webkit-linear-gradient(top, #5BAE4E 0%, #64D472 50%, #7CFAAE 100%);
    background: linear-gradient(to bottom, #5BAE4E 0%, #64D472 50%, #7CFAAE 100%);
}
</style>