#7F9DA7 - #9EA77F | colorate

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

Blend #7F9DA7 to #9EA77F

#7F9DA7

#9EA77F

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

RGBブレンド

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

0.0%	0.0% #7F9DA7	RGB 127 157 167	#7F9DA7
16.7%	16.7% #849EA1	RGB 132 158 161	#849EA1
33.3%	33.3% #89A09A	RGB 137 160 154	#89A09A
50.0%	50.0% #8EA293	RGB 142 162 147	#8EA293
66.7%	66.7% #93A38D	RGB 147 163 141	#93A38D
83.3%	83.3% #98A586	RGB 152 165 134	#98A586
100.0%	100.0% #9EA77F	RGB 158 167 127	#9EA77F

#7F9DA7 #849EA1 #89A09A #8EA293 #93A38D #98A586 #9EA77F

#7F9DA7 - #9EA77F

HSVブレンド

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

0.0%	0.0% #7F9DA7	RGB 127 157 167	#7F9DA7
16.7%	16.7% #7FA7A3	RGB 127 167 163	#7FA7A3
33.3%	33.3% #7FA796	RGB 127 167 150	#7FA796
50.0%	50.0% #7FA788	RGB 127 167 136	#7FA788
66.7%	66.7% #83A77F	RGB 131 167 127	#83A77F
83.3%	83.3% #90A77F	RGB 144 167 127	#90A77F
100.0%	100.0% #9EA77F	RGB 158 167 127	#9EA77F

#7F9DA7 #7FA7A3 #7FA796 #7FA788 #83A77F #90A77F #9EA77F

#7F9DA7 - #7FA788 - #9EA77F

CSSコード

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

/* HSV Gradation */
div {                
    background: -moz-linear-gradient(top, #7F9DA7 0%, #7FA788 50%, #9EA77F 100%);
    background: -webkit-linear-gradient(top, #7F9DA7 0%, #7FA788 50%, #9EA77F 100%);
    background: linear-gradient(to bottom, #7F9DA7 0%, #7FA788 50%, #9EA77F 100%); 
}
</style>