#63507E - #8A5189 | colorate

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

Blend #63507E to #8A5189

#63507E #8A5189

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

RGBブレンド

#63507E - #8A5189 | colorate

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

0.0%	0.0% #63507E	RGB 99 80 126	#63507E
16.7%	16.7% #69507F	RGB 105 80 127	#69507F
33.3%	33.3% #705081	RGB 112 80 129	#705081
50.0%	50.0% #765083	RGB 118 80 131	#765083
66.7%	66.7% #7D5085	RGB 125 80 133	#7D5085
83.3%	83.3% #835087	RGB 131 80 135	#835087
100.0%	100.0% #8A5189	RGB 138 81 137	#8A5189

#63507E #69507F #705081 #765083 #7D5085 #835087 #8A5189

#63507E - #8A5189

HSVブレンド

#63507E - #8A5189 | colorate

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

0.0%	0.0% #63507E	RGB 99 80 126	#63507E
16.7%	16.7% #685080	RGB 104 80 128	#685080
33.3%	33.3% #6E5082	RGB 110 80 130	#6E5082
50.0%	50.0% #755084	RGB 117 80 132	#755084
66.7%	66.7% #7C5086	RGB 124 80 134	#7C5086
83.3%	83.3% #835088	RGB 131 80 136	#835088
100.0%	100.0% #8A5189	RGB 138 81 137	#8A5189

#63507E #685080 #6E5082 #755084 #7C5086 #835088 #8A5189

#63507E - #755084 - #8A5189

CSSコード

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

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