#F1F0FF - #F4D0F1 | colorate

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

Blend #F1F0FF to #F4D0F1

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

RGBブレンド

#F1F0FF - #F4D0F1 | colorate

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

0.0%	0.0% #F1F0FF	RGB 241 240 255	#F1F0FF
16.7%	16.7% #F1EAFC	RGB 241 234 252	#F1EAFC
33.3%	33.3% #F2E5FA	RGB 242 229 250	#F2E5FA
50.0%	50.0% #F2E0F8	RGB 242 224 248	#F2E0F8
66.7%	66.7% #F3DAF5	RGB 243 218 245	#F3DAF5
83.3%	83.3% #F3D5F3	RGB 243 213 243	#F3D5F3
100.0%	100.0% #F4D0F1	RGB 244 208 241	#F4D0F1

#F1F0FF #F1EAFC #F2E5FA #F2E0F8 #F3DAF5 #F3D5F3 #F4D0F1

#F1F0FF - #F4D0F1

HSVブレンド

#F1F0FF - #F4D0F1 | colorate

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

0.0%	0.0% #F1F0FF	RGB 241 240 255	#F1F0FF
16.7%	16.7% #EEEAFD	RGB 238 234 253	#EEEAFD
33.3%	33.3% #EEE5FB	RGB 238 229 251	#EEE5FB
50.0%	50.0% #EEDFF9	RGB 238 223 249	#EEDFF9
66.7%	66.7% #F0DAF7	RGB 240 218 247	#F0DAF7
83.3%	83.3% #F3D5F5	RGB 243 213 245	#F3D5F5
100.0%	100.0% #F4D0F1	RGB 244 208 241	#F4D0F1

#F1F0FF #EEEAFD #EEE5FB #EEDFF9 #F0DAF7 #F3D5F5 #F4D0F1

#F1F0FF - #EEDFF9 - #F4D0F1

CSSコード

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

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