#A5765D - #5DA575 | colorate

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

Blend #A5765D to #5DA575

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

RGBブレンド

#A5765D - #5DA575 | colorate

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

0.0%	0.0% #A5765D	RGB 165 118 93	#A5765D
16.7%	16.7% #997D61	RGB 153 125 97	#997D61
33.3%	33.3% #8D8565	RGB 141 133 101	#8D8565
50.0%	50.0% #818D69	RGB 129 141 105	#818D69
66.7%	66.7% #75956D	RGB 117 149 109	#75956D
83.3%	83.3% #699D71	RGB 105 157 113	#699D71
100.0%	100.0% #5DA575	RGB 93 165 117	#5DA575

#A5765D #997D61 #8D8565 #818D69 #75956D #699D71 #5DA575

#A5765D - #5DA575

HSVブレンド

#A5765D - #5DA575 | colorate

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

0.0%	0.0% #A5765D	RGB 165 118 93	#A5765D
16.7%	16.7% #A58D5D	RGB 165 141 93	#A58D5D
33.3%	33.3% #A4A55D	RGB 164 165 93	#A4A55D
50.0%	50.0% #8CA55D	RGB 140 165 93	#8CA55D
66.7%	66.7% #74A55D	RGB 116 165 93	#74A55D
83.3%	83.3% #5DA55D	RGB 93 165 93	#5DA55D
100.0%	100.0% #5DA575	RGB 93 165 117	#5DA575

#A5765D #A58D5D #A4A55D #8CA55D #74A55D #5DA55D #5DA575

#A5765D - #8CA55D - #5DA575

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A5765D 0%, #8CA55D 50%, #5DA575 100%);
    background: -webkit-linear-gradient(top, #A5765D 0%, #8CA55D 50%, #5DA575 100%);
    background: linear-gradient(to bottom, #A5765D 0%, #8CA55D 50%, #5DA575 100%);
}
</style>