#8F646D - #A86A64 | colorate

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

Blend #8F646D to #A86A64

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

RGBブレンド

#8F646D - #A86A64 | colorate

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

0.0%	0.0% #8F646D	RGB 143 100 109	#8F646D
16.7%	16.7% #93656B	RGB 147 101 107	#93656B
33.3%	33.3% #97666A	RGB 151 102 106	#97666A
50.0%	50.0% #9B6768	RGB 155 103 104	#9B6768
66.7%	66.7% #9F6867	RGB 159 104 103	#9F6867
83.3%	83.3% #A36965	RGB 163 105 101	#A36965
100.0%	100.0% #A86A64	RGB 168 106 100	#A86A64

#8F646D #93656B #97666A #9B6768 #9F6867 #A36965 #A86A64

#8F646D - #A86A64

HSVブレンド

#8F646D - #A86A64 | colorate

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

0.0%	0.0% #8F646D	RGB 143 100 109	#8F646D
16.7%	16.7% #93646B	RGB 147 100 107	#93646B
33.3%	33.3% #97646A	RGB 151 100 106	#97646A
50.0%	50.0% #9B6467	RGB 155 100 103	#9B6467
66.7%	66.7% #9F6465	RGB 159 100 101	#9F6465
83.3%	83.3% #A36664	RGB 163 102 100	#A36664
100.0%	100.0% #A86A64	RGB 168 106 100	#A86A64

#8F646D #93646B #97646A #9B6467 #9F6465 #A36664 #A86A64

#8F646D - #9B6467 - #A86A64

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8F646D 0%, #9B6467 50%, #A86A64 100%);
    background: -webkit-linear-gradient(top, #8F646D 0%, #9B6467 50%, #A86A64 100%);
    background: linear-gradient(to bottom, #8F646D 0%, #9B6467 50%, #A86A64 100%);
}
</style>