#EE00FF - #7B7BFF | colorate

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

Blend #EE00FF to #7B7BFF

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

RGBブレンド

#EE00FF - #7B7BFF | colorate

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

0.0%	0.0% #EE00FF	RGB 238 0 255	#EE00FF
16.7%	16.7% #DA14FF	RGB 218 20 255	#DA14FF
33.3%	33.3% #C729FF	RGB 199 41 255	#C729FF
50.0%	50.0% #B43DFF	RGB 180 61 255	#B43DFF
66.7%	66.7% #A152FF	RGB 161 82 255	#A152FF
83.3%	83.3% #8E66FF	RGB 142 102 255	#8E66FF
100.0%	100.0% #7B7BFF	RGB 123 123 255	#7B7BFF

#EE00FF #DA14FF #C729FF #B43DFF #A152FF #8E66FF #7B7BFF

#EE00FF - #7B7BFF

HSVブレンド

#EE00FF - #7B7BFF | colorate

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

0.0%	0.0% #EE00FF	RGB 238 0 255	#EE00FF
16.7%	16.7% #CA14FF	RGB 202 20 255	#CA14FF
33.3%	33.3% #AE28FF	RGB 174 40 255	#AE28FF
50.0%	50.0% #973DFF	RGB 151 61 255	#973DFF
66.7%	66.7% #8752FF	RGB 135 82 255	#8752FF
83.3%	83.3% #7E66FF	RGB 126 102 255	#7E66FF
100.0%	100.0% #7B7BFF	RGB 123 123 255	#7B7BFF

#EE00FF #CA14FF #AE28FF #973DFF #8752FF #7E66FF #7B7BFF

#EE00FF - #973DFF - #7B7BFF

CSSコード

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

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