#BBC6FE - #5672D3 | colorate

colorate is a color scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work. Make this site better

Blend #BBC6FE to #5672D3

#BBC6FE #5672D3

Calculate the color between two colors, #BBC6FE and #5672D3. In calculation of RGB values, saturation between the dissimilar colors is low. In calculating of HSV values, saturation between the dissimilar colors is not low.

RGB Blend(Linear)

#BBC6FE - #5672D3 | colorate

Calculation of color between two colors based on RGB value. For colors that are distant from each other, the saturation between the two colors decreases. Expand the color between two colors with #BBC6FE as 0% and #5672D3 as 100%.

0.0%	0.0% #BBC6FE	RGB 187 198 254	#BBC6FE
16.7%	16.7% #AAB8F6	RGB 170 184 246	#AAB8F6
33.3%	33.3% #99AAEF	RGB 153 170 239	#99AAEF
50.0%	50.0% #889CE8	RGB 136 156 232	#889CE8
66.7%	66.7% #778EE1	RGB 119 142 225	#778EE1
83.3%	83.3% #6680DA	RGB 102 128 218	#6680DA
100.0%	100.0% #5672D3	RGB 86 114 211	#5672D3

#BBC6FE #AAB8F6 #99AAEF #889CE8 #778EE1 #6680DA #5672D3

#BBC6FE - #5672D3

HSV Blend

#BBC6FE - #5672D3 | colorate

Calculation of color between two colors based on HSV value. Even between distinct colors of color, the saturation between the two colors does not decrease. Expand the color between two colors with #BBC6FE as 0% and #5672D3 as 100%.

0.0%	0.0% #BBC6FE	RGB 187 198 254	#BBC6FE
16.7%	16.7% #A8B5F6	RGB 168 181 246	#A8B5F6
33.3%	33.3% #96A6EF	RGB 150 166 239	#96A6EF
50.0%	50.0% #8498E8	RGB 132 152 232	#8498E8
66.7%	66.7% #748AE1	RGB 116 138 225	#748AE1
83.3%	83.3% #647DDA	RGB 100 125 218	#647DDA
100.0%	100.0% #5672D3	RGB 86 114 211	#5672D3

#BBC6FE #A8B5F6 #96A6EF #8498E8 #748AE1 #647DDA #5672D3

#BBC6FE - #8498E8 - #5672D3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BBC6FE 0%, #8498E8 50%, #5672D3 100%);
    background: -webkit-linear-gradient(top, #BBC6FE 0%, #8498E8 50%, #5672D3 100%);
    background: linear-gradient(to bottom, #BBC6FE 0%, #8498E8 50%, #5672D3 100%);
}
</style>