#7FA796 - #A7957F | colorate

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

Blend #7FA796 to #A7957F

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

RGBブレンド

#7FA796 - #A7957F | colorate

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

0.0%	0.0% #7FA796	RGB 127 167 150	#7FA796
16.7%	16.7% #85A492	RGB 133 164 146	#85A492
33.3%	33.3% #8CA18E	RGB 140 161 142	#8CA18E
50.0%	50.0% #939E8A	RGB 147 158 138	#939E8A
66.7%	66.7% #999B86	RGB 153 155 134	#999B86
83.3%	83.3% #A09882	RGB 160 152 130	#A09882
100.0%	100.0% #A7957F	RGB 167 149 127	#A7957F

#7FA796 #85A492 #8CA18E #939E8A #999B86 #A09882 #A7957F

#7FA796 - #A7957F

HSVブレンド

#7FA796 - #A7957F | colorate

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

0.0%	0.0% #7FA796	RGB 127 167 150	#7FA796
16.7%	16.7% #7FA788	RGB 127 167 136	#7FA788
33.3%	33.3% #83A77F	RGB 131 167 127	#83A77F
50.0%	50.0% #90A77F	RGB 144 167 127	#90A77F
66.7%	66.7% #9EA77F	RGB 158 167 127	#9EA77F
83.3%	83.3% #A7A27F	RGB 167 162 127	#A7A27F
100.0%	100.0% #A7957F	RGB 167 149 127	#A7957F

#7FA796 #7FA788 #83A77F #90A77F #9EA77F #A7A27F #A7957F

#7FA796 - #90A77F - #A7957F

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #7FA796 0%, #90A77F 50%, #A7957F 100%);
    background: -webkit-linear-gradient(top, #7FA796 0%, #90A77F 50%, #A7957F 100%);
    background: linear-gradient(to bottom, #7FA796 0%, #90A77F 50%, #A7957F 100%);
}
</style>