#BD00FF - #FF00DE | colorate

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

Blend #BD00FF to #FF00DE

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

RGBブレンド

#BD00FF - #FF00DE | colorate

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

0.0%	0.0% #BD00FF	RGB 189 0 255	#BD00FF
16.7%	16.7% #C800F9	RGB 200 0 249	#C800F9
33.3%	33.3% #D300F4	RGB 211 0 244	#D300F4
50.0%	50.0% #DE00EE	RGB 222 0 238	#DE00EE
66.7%	66.7% #E900E9	RGB 233 0 233	#E900E9
83.3%	83.3% #F400E3	RGB 244 0 227	#F400E3
100.0%	100.0% #FF00DE	RGB 255 0 222	#FF00DE

#BD00FF #C800F9 #D300F4 #DE00EE #E900E9 #F400E3 #FF00DE

#BD00FF - #FF00DE

HSVブレンド

#BD00FF - #FF00DE | colorate

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

0.0%	0.0% #BC00FF	RGB 188 0 255	#BC00FF
16.7%	16.7% #CD00FF	RGB 205 0 255	#CD00FF
33.3%	33.3% #DE00FF	RGB 222 0 255	#DE00FF
50.0%	50.0% #EE00FF	RGB 238 0 255	#EE00FF
66.7%	66.7% #FE00FF	RGB 254 0 255	#FE00FF
83.3%	83.3% #FF00EE	RGB 255 0 238	#FF00EE
100.0%	100.0% #FF00DE	RGB 255 0 222	#FF00DE

#BC00FF #CD00FF #DE00FF #EE00FF #FE00FF #FF00EE #FF00DE

#BD00FF - #EE00FF - #FF00DE

CSSコード

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

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