#563521 - #352156 | colorate

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

Blend #563521 to #352156

#563521 #352156

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

RGBブレンド

#563521 - #352156 | colorate

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

0.0%	0.0% #563521	RGB 86 53 33	#563521
16.7%	16.7% #503129	RGB 80 49 41	#503129
33.3%	33.3% #4B2E32	RGB 75 46 50	#4B2E32
50.0%	50.0% #452B3B	RGB 69 43 59	#452B3B
66.7%	66.7% #402744	RGB 64 39 68	#402744
83.3%	83.3% #3A244D	RGB 58 36 77	#3A244D
100.0%	100.0% #352156	RGB 53 33 86	#352156

#563521 #503129 #4B2E32 #452B3B #402744 #3A244D #352156

#563521 - #352156

HSVブレンド

#563521 - #352156 | colorate

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

0.0%	0.0% #563521	RGB 86 53 33	#563521
16.7%	16.7% #562321	RGB 86 35 33	#562321
33.3%	33.3% #562130	RGB 86 33 48	#562130
50.0%	50.0% #562142	RGB 86 33 66	#562142
66.7%	66.7% #562153	RGB 86 33 83	#562153
83.3%	83.3% #462156	RGB 70 33 86	#462156
100.0%	100.0% #352156	RGB 53 33 86	#352156

#563521 #562321 #562130 #562142 #562153 #462156 #352156

#563521 - #562142 - #352156

CSSコード

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

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