#BCABF6 - #ABF6BD | colorate

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

Blend #BCABF6 to #ABF6BD

#BCABF6

#ABF6BD

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

RGBブレンド

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

0.0%	0.0% #BCABF6	RGB 188 171 246	#BCABF6
16.7%	16.7% #BAB7ED	RGB 186 183 237	#BAB7ED
33.3%	33.3% #B7C4E3	RGB 183 196 227	#B7C4E3
50.0%	50.0% #B4D0DA	RGB 180 208 218	#B4D0DA
66.7%	66.7% #B1DDD0	RGB 177 221 208	#B1DDD0
83.3%	83.3% #AEE9C7	RGB 174 233 199	#AEE9C7
100.0%	100.0% #ABF6BD	RGB 171 246 189	#ABF6BD

#BCABF6 #BAB7ED #B7C4E3 #B4D0DA #B1DDD0 #AEE9C7 #ABF6BD

#BCABF6 - #ABF6BD

HSVブレンド

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

0.0%	0.0% #BBABF6	RGB 187 171 246	#BBABF6
16.7%	16.7% #ABB2F6	RGB 171 178 246	#ABB2F6
33.3%	33.3% #ABCBF6	RGB 171 203 246	#ABCBF6
50.0%	50.0% #ABE4F6	RGB 171 228 246	#ABE4F6
66.7%	66.7% #ABF6EE	RGB 171 246 238	#ABF6EE
83.3%	83.3% #ABF6D5	RGB 171 246 213	#ABF6D5
100.0%	100.0% #ABF6BD	RGB 171 246 189	#ABF6BD

#BBABF6 #ABB2F6 #ABCBF6 #ABE4F6 #ABF6EE #ABF6D5 #ABF6BD

#BBABF6 - #ABE4F6 - #ABF6BD

CSSコード

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

/* HSV Gradation */
div {                
    background: -moz-linear-gradient(top, #BBABF6 0%, #ABE4F6 50%, #ABF6BD 100%);
    background: -webkit-linear-gradient(top, #BBABF6 0%, #ABE4F6 50%, #ABF6BD 100%);
    background: linear-gradient(to bottom, #BBABF6 0%, #ABE4F6 50%, #ABF6BD 100%); 
}
</style>