#A58873 - #AAB172 | colorate

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

Blend #A58873 to #AAB172

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

RGBブレンド

#A58873 - #AAB172 | colorate

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

0.0%	0.0% #A58873	RGB 165 136 115	#A58873
16.7%	16.7% #A58E72	RGB 165 142 114	#A58E72
33.3%	33.3% #A69572	RGB 166 149 114	#A69572
50.0%	50.0% #A79C72	RGB 167 156 114	#A79C72
66.7%	66.7% #A8A372	RGB 168 163 114	#A8A372
83.3%	83.3% #A9AA72	RGB 169 170 114	#A9AA72
100.0%	100.0% #AAB172	RGB 170 177 114	#AAB172

#A58873 #A58E72 #A69572 #A79C72 #A8A372 #A9AA72 #AAB172

#A58873 - #AAB172

HSVブレンド

#A58873 - #AAB172 | colorate

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

0.0%	0.0% #A58873	RGB 165 136 115	#A58873
16.7%	16.7% #A78E72	RGB 167 142 114	#A78E72
33.3%	33.3% #A99672	RGB 169 150 114	#A99672
50.0%	50.0% #AB9D72	RGB 171 157 114	#AB9D72
66.7%	66.7% #ADA672	RGB 173 166 114	#ADA672
83.3%	83.3% #AFAE72	RGB 175 174 114	#AFAE72
100.0%	100.0% #AAB172	RGB 170 177 114	#AAB172

#A58873 #A78E72 #A99672 #AB9D72 #ADA672 #AFAE72 #AAB172

#A58873 - #AB9D72 - #AAB172

CSSコード

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

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