#FF00D1 - #8D8DFF | colorate

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

Blend #FF00D1 to #8D8DFF

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

RGBブレンド

#FF00D1 - #8D8DFF | colorate

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

0.0%	0.0% #FF00D1	RGB 255 0 209	#FF00D1
16.7%	16.7% #EC17D8	RGB 236 23 216	#EC17D8
33.3%	33.3% #D92FE0	RGB 217 47 224	#D92FE0
50.0%	50.0% #C646E8	RGB 198 70 232	#C646E8
66.7%	66.7% #B35EEF	RGB 179 94 239	#B35EEF
83.3%	83.3% #A075F7	RGB 160 117 247	#A075F7
100.0%	100.0% #8D8DFF	RGB 141 141 255	#8D8DFF

#FF00D1 #EC17D8 #D92FE0 #C646E8 #B35EEF #A075F7 #8D8DFF

#FF00D1 - #8D8DFF

HSVブレンド

#FF00D1 - #8D8DFF | colorate

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

0.0%	0.0% #FF00D1	RGB 255 0 209	#FF00D1
16.7%	16.7% #FB17FF	RGB 251 23 255	#FB17FF
33.3%	33.3% #D22EFF	RGB 210 46 255	#D22EFF
50.0%	50.0% #B346FF	RGB 179 70 255	#B346FF
66.7%	66.7% #9D5EFF	RGB 157 94 255	#9D5EFF
83.3%	83.3% #9075FF	RGB 144 117 255	#9075FF
100.0%	100.0% #8D8DFF	RGB 141 141 255	#8D8DFF

#FF00D1 #FB17FF #D22EFF #B346FF #9D5EFF #9075FF #8D8DFF

#FF00D1 - #B346FF - #8D8DFF

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #FF00D1 0%, #B346FF 50%, #8D8DFF 100%);
    background: -webkit-linear-gradient(top, #FF00D1 0%, #B346FF 50%, #8D8DFF 100%);
    background: linear-gradient(to bottom, #FF00D1 0%, #B346FF 50%, #8D8DFF 100%);
}
</style>