#9CA997 - #9AC29A | colorate

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

Blend #9CA997 to #9AC29A

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

RGBブレンド

#9CA997 - #9AC29A | colorate

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

0.0%	0.0% #9CA997	RGB 156 169 151	#9CA997
16.7%	16.7% #9BAD97	RGB 155 173 151	#9BAD97
33.3%	33.3% #9BB198	RGB 155 177 152	#9BB198
50.0%	50.0% #9BB598	RGB 155 181 152	#9BB598
66.7%	66.7% #9AB999	RGB 154 185 153	#9AB999
83.3%	83.3% #9ABD99	RGB 154 189 153	#9ABD99
100.0%	100.0% #9AC29A	RGB 154 194 154	#9AC29A

#9CA997 #9BAD97 #9BB198 #9BB598 #9AB999 #9ABD99 #9AC29A

#9CA997 - #9AC29A

HSVブレンド

#9CA997 - #9AC29A | colorate

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

0.0%	0.0% #9CA997	RGB 156 169 151	#9CA997
16.7%	16.7% #9CAD97	RGB 156 173 151	#9CAD97
33.3%	33.3% #9DB198	RGB 157 177 152	#9DB198
50.0%	50.0% #9DB599	RGB 157 181 153	#9DB599
66.7%	66.7% #9CB999	RGB 156 185 153	#9CB999
83.3%	83.3% #9BBD99	RGB 155 189 153	#9BBD99
100.0%	100.0% #9AC29A	RGB 154 194 154	#9AC29A

#9CA997 #9CAD97 #9DB198 #9DB599 #9CB999 #9BBD99 #9AC29A

#9CA997 - #9DB599 - #9AC29A

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #9CA997 0%, #9DB599 50%, #9AC29A 100%);
    background: -webkit-linear-gradient(top, #9CA997 0%, #9DB599 50%, #9AC29A 100%);
    background: linear-gradient(to bottom, #9CA997 0%, #9DB599 50%, #9AC29A 100%);
}
</style>