#8F4E8C - #8D8F4E | colorate

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

Blend #8F4E8C to #8D8F4E

#8F4E8C #8D8F4E

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

RGBブレンド

#8F4E8C - #8D8F4E | colorate

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

0.0%	0.0% #8F4E8C	RGB 143 78 140	#8F4E8C
16.7%	16.7% #8E5881	RGB 142 88 129	#8E5881
33.3%	33.3% #8E6377	RGB 142 99 119	#8E6377
50.0%	50.0% #8E6E6D	RGB 142 110 109	#8E6E6D
66.7%	66.7% #8D7962	RGB 141 121 98	#8D7962
83.3%	83.3% #8D8458	RGB 141 132 88	#8D8458
100.0%	100.0% #8D8F4E	RGB 141 143 78	#8D8F4E

#8F4E8C #8E5881 #8E6377 #8E6E6D #8D7962 #8D8458 #8D8F4E

#8F4E8C - #8D8F4E

HSVブレンド

#8F4E8C - #8D8F4E | colorate

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

0.0%	0.0% #8F4E8C	RGB 143 78 140	#8F4E8C
16.7%	16.7% #8F4E76	RGB 143 78 118	#8F4E76
33.3%	33.3% #8F4E60	RGB 143 78 96	#8F4E60
50.0%	50.0% #8F504E	RGB 143 80 78	#8F504E
66.7%	66.7% #8F664E	RGB 143 102 78	#8F664E
83.3%	83.3% #8F7B4E	RGB 143 123 78	#8F7B4E
100.0%	100.0% #8D8F4E	RGB 141 143 78	#8D8F4E

#8F4E8C #8F4E76 #8F4E60 #8F504E #8F664E #8F7B4E #8D8F4E

#8F4E8C - #8F504E - #8D8F4E

CSSコード

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

/* HSV Gradation */
div {
    background: -moz-linear-gradient(top, #8F4E8C 0%, #8F504E 50%, #8D8F4E 100%);
    background: -webkit-linear-gradient(top, #8F4E8C 0%, #8F504E 50%, #8D8F4E 100%);
    background: linear-gradient(to bottom, #8F4E8C 0%, #8F504E 50%, #8D8F4E 100%);
}
</style>