#8F825C - #5C8F81 | colorate

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

Blend #8F825C to #5C8F81

#8F825C #5C8F81

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

RGBブレンド

#8F825C - #5C8F81 | colorate

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

0.0%	0.0% #8F825C	RGB 143 130 92	#8F825C
16.7%	16.7% #868462	RGB 134 132 98	#868462
33.3%	33.3% #7E8668	RGB 126 134 104	#7E8668
50.0%	50.0% #75886E	RGB 117 136 110	#75886E
66.7%	66.7% #6D8A74	RGB 109 138 116	#6D8A74
83.3%	83.3% #648C7A	RGB 100 140 122	#648C7A
100.0%	100.0% #5C8F81	RGB 92 143 129	#5C8F81

#8F825C #868462 #7E8668 #75886E #6D8A74 #648C7A #5C8F81

#8F825C - #5C8F81

HSVブレンド

#8F825C - #5C8F81 | colorate

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

0.0%	0.0% #8F825C	RGB 143 130 92	#8F825C
16.7%	16.7% #8B8F5C	RGB 139 143 92	#8B8F5C
33.3%	33.3% #7A8F5C	RGB 122 143 92	#7A8F5C
50.0%	50.0% #698F5C	RGB 105 143 92	#698F5C
66.7%	66.7% #5C8F5F	RGB 92 143 95	#5C8F5F
83.3%	83.3% #5C8F70	RGB 92 143 112	#5C8F70
100.0%	100.0% #5C8F81	RGB 92 143 129	#5C8F81

#8F825C #8B8F5C #7A8F5C #698F5C #5C8F5F #5C8F70 #5C8F81

#8F825C - #698F5C - #5C8F81

CSSコード

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

/* HSV Gradation */
div {
    background: -moz-linear-gradient(top, #8F825C 0%, #698F5C 50%, #5C8F81 100%);
    background: -webkit-linear-gradient(top, #8F825C 0%, #698F5C 50%, #5C8F81 100%);
    background: linear-gradient(to bottom, #8F825C 0%, #698F5C 50%, #5C8F81 100%);
}
</style>