#9A67BC - #CA5ED5 | colorate

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

Blend #9A67BC to #CA5ED5

#9A67BC #CA5ED5

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

RGBブレンド

#9A67BC - #CA5ED5 | colorate

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

0.0%	0.0% #9A67BC	RGB 154 103 188	#9A67BC
16.7%	16.7% #A265C0	RGB 162 101 192	#A265C0
33.3%	33.3% #AA64C4	RGB 170 100 196	#AA64C4
50.0%	50.0% #B262C8	RGB 178 98 200	#B262C8
66.7%	66.7% #BA61CC	RGB 186 97 204	#BA61CC
83.3%	83.3% #C25FD0	RGB 194 95 208	#C25FD0
100.0%	100.0% #CA5ED5	RGB 202 94 213	#CA5ED5

#9A67BC #A265C0 #AA64C4 #B262C8 #BA61CC #C25FD0 #CA5ED5

#9A67BC - #CA5ED5

HSVブレンド

#9A67BC - #CA5ED5 | colorate

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

0.0%	0.0% #9967BC	RGB 153 103 188	#9967BC
16.7%	16.7% #A065C0	RGB 160 101 192	#A065C0
33.3%	33.3% #A764C4	RGB 167 100 196	#A764C4
50.0%	50.0% #AF63C8	RGB 175 99 200	#AF63C8
66.7%	66.7% #B761CC	RGB 183 97 204	#B761CC
83.3%	83.3% #C05FD0	RGB 192 95 208	#C05FD0
100.0%	100.0% #CA5ED5	RGB 202 94 213	#CA5ED5

#9967BC #A065C0 #A764C4 #AF63C8 #B761CC #C05FD0 #CA5ED5

#9A67BC - #AF63C8 - #CA5ED5

CSSコード

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

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