#7D8181 - #86949A | colorate

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

Blend #7D8181 to #86949A

#7D8181 #86949A

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

RGBブレンド

#7D8181 - #86949A | colorate

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

0.0%	0.0% #7D8181	RGB 125 129 129	#7D8181
16.7%	16.7% #7E8485	RGB 126 132 133	#7E8485
33.3%	33.3% #808789	RGB 128 135 137	#808789
50.0%	50.0% #818A8D	RGB 129 138 141	#818A8D
66.7%	66.7% #838D91	RGB 131 141 145	#838D91
83.3%	83.3% #849095	RGB 132 144 149	#849095
100.0%	100.0% #86949A	RGB 134 148 154	#86949A

#7D8181 #7E8485 #808789 #818A8D #838D91 #849095 #86949A

#7D8181 - #86949A

HSVブレンド

#7D8181 - #86949A | colorate

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

0.0%	0.0% #7D8181	RGB 125 129 129	#7D8181
16.7%	16.7% #7E8485	RGB 126 132 133	#7E8485
33.3%	33.3% #808889	RGB 128 136 137	#808889
50.0%	50.0% #828B8D	RGB 130 139 141	#828B8D
66.7%	66.7% #838E91	RGB 131 142 145	#838E91
83.3%	83.3% #849195	RGB 132 145 149	#849195
100.0%	100.0% #86949A	RGB 134 148 154	#86949A

#7D8181 #7E8485 #808889 #828B8D #838E91 #849195 #86949A

#7D8181 - #828B8D - #86949A

CSSコード

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

/* HSV Gradation */
div {
    background: -moz-linear-gradient(top, #7D8181 0%, #828B8D 50%, #86949A 100%);
    background: -webkit-linear-gradient(top, #7D8181 0%, #828B8D 50%, #86949A 100%);
    background: linear-gradient(to bottom, #7D8181 0%, #828B8D 50%, #86949A 100%);
}
</style>