#8B578F - #7788E5 | colorate

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

Blend #8B578F to #7788E5

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

RGBブレンド

#8B578F - #7788E5 | colorate

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

0.0%	0.0% #8B578F	RGB 139 87 143	#8B578F
16.7%	16.7% #875F9D	RGB 135 95 157	#875F9D
33.3%	33.3% #8467AB	RGB 132 103 171	#8467AB
50.0%	50.0% #816FBA	RGB 129 111 186	#816FBA
66.7%	66.7% #7D77C8	RGB 125 119 200	#7D77C8
83.3%	83.3% #7A7FD6	RGB 122 127 214	#7A7FD6
100.0%	100.0% #7788E5	RGB 119 136 229	#7788E5

#8B578F #875F9D #8467AB #816FBA #7D77C8 #7A7FD6 #7788E5

#8B578F - #7788E5

HSVブレンド

#8B578F - #7788E5 | colorate

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

0.0%	0.0% #8B578F	RGB 139 87 143	#8B578F
16.7%	16.7% #8D5D9D	RGB 141 93 157	#8D5D9D
33.3%	33.3% #8C63AB	RGB 140 99 171	#8C63AB
50.0%	50.0% #8868BA	RGB 136 104 186	#8868BA
66.7%	66.7% #806EC8	RGB 128 110 200	#806EC8
83.3%	83.3% #7572D6	RGB 117 114 214	#7572D6
100.0%	100.0% #7788E5	RGB 119 136 229	#7788E5

#8B578F #8D5D9D #8C63AB #8868BA #806EC8 #7572D6 #7788E5

#8B578F - #8868BA - #7788E5

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8B578F 0%, #8868BA 50%, #7788E5 100%);
    background: -webkit-linear-gradient(top, #8B578F 0%, #8868BA 50%, #7788E5 100%);
    background: linear-gradient(to bottom, #8B578F 0%, #8868BA 50%, #7788E5 100%);
}
</style>