#2222B2 - #BFBFE9 | colorate

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

Blend #2222B2 to #BFBFE9

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

RGBブレンド

#2222B2 - #BFBFE9 | colorate

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

0.0%	0.0% #2222B2	RGB 34 34 178	#2222B2
16.7%	16.7% #3C3CBB	RGB 60 60 187	#3C3CBB
33.3%	33.3% #5656C4	RGB 86 86 196	#5656C4
50.0%	50.0% #7070CD	RGB 112 112 205	#7070CD
66.7%	66.7% #8A8AD6	RGB 138 138 214	#8A8AD6
83.3%	83.3% #A4A4DF	RGB 164 164 223	#A4A4DF
100.0%	100.0% #BFBFE9	RGB 191 191 233	#BFBFE9

#2222B2 #3C3CBB #5656C4 #7070CD #8A8AD6 #A4A4DF #BFBFE9

#2222B2 - #BFBFE9

HSVブレンド

#2222B2 - #BFBFE9 | colorate

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

0.0%	0.0% #2222B2	RGB 34 34 178	#2222B2
16.7%	16.7% #3737BB	RGB 55 55 187	#3737BB
33.3%	33.3% #4E4EC4	RGB 78 78 196	#4E4EC4
50.0%	50.0% #6767CD	RGB 103 103 205	#6767CD
66.7%	66.7% #8282D6	RGB 130 130 214	#8282D6
83.3%	83.3% #A0A0DF	RGB 160 160 223	#A0A0DF
100.0%	100.0% #BFBFE9	RGB 191 191 233	#BFBFE9

#2222B2 #3737BB #4E4EC4 #6767CD #8282D6 #A0A0DF #BFBFE9

#2222B2 - #6767CD - #BFBFE9

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2222B2 0%, #6767CD 50%, #BFBFE9 100%);
    background: -webkit-linear-gradient(top, #2222B2 0%, #6767CD 50%, #BFBFE9 100%);
    background: linear-gradient(to bottom, #2222B2 0%, #6767CD 50%, #BFBFE9 100%);
}
</style>