#758E63 - #6CA764 | colorate

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

Blend #758E63 to #6CA764

#758E63 #6CA764

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

RGBブレンド

#758E63 - #6CA764 | colorate

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

0.0%	0.0% #758E63	RGB 117 142 99	#758E63
16.7%	16.7% #739263	RGB 115 146 99	#739263
33.3%	33.3% #729663	RGB 114 150 99	#729663
50.0%	50.0% #709A63	RGB 112 154 99	#709A63
66.7%	66.7% #6F9E63	RGB 111 158 99	#6F9E63
83.3%	83.3% #6DA263	RGB 109 162 99	#6DA263
100.0%	100.0% #6CA764	RGB 108 167 100	#6CA764

#758E63 #739263 #729663 #709A63 #6F9E63 #6DA263 #6CA764

#758E63 - #6CA764

HSVブレンド

#758E63 - #6CA764 | colorate

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

0.0%	0.0% #758E63	RGB 117 142 99	#758E63
16.7%	16.7% #749263	RGB 116 146 99	#749263
33.3%	33.3% #739663	RGB 115 150 99	#739663
50.0%	50.0% #729A64	RGB 114 154 100	#729A64
66.7%	66.7% #719E64	RGB 113 158 100	#719E64
83.3%	83.3% #6EA264	RGB 110 162 100	#6EA264
100.0%	100.0% #6CA764	RGB 108 167 100	#6CA764

#758E63 #749263 #739663 #729A64 #719E64 #6EA264 #6CA764

#758E63 - #729A64 - #6CA764

CSSコード

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

/* HSV Gradation */
div {
    background: -moz-linear-gradient(top, #758E63 0%, #729A64 50%, #6CA764 100%);
    background: -webkit-linear-gradient(top, #758E63 0%, #729A64 50%, #6CA764 100%);
    background: linear-gradient(to bottom, #758E63 0%, #729A64 50%, #6CA764 100%);
}
</style>