#55AFDA - #BBC4FA | 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 #55AFDA to #BBC4FA

#55AFDA #BBC4FA

Calculate the color between two colors, #55AFDA and #BBC4FA. 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)

#55AFDA - #BBC4FA | 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 #55AFDA as 0% and #BBC4FA as 100%.

0.0%	0.0% #55AFDA	RGB 85 175 218	#55AFDA
16.7%	16.7% #66B2DF	RGB 102 178 223	#66B2DF
33.3%	33.3% #77B6E4	RGB 119 182 228	#77B6E4
50.0%	50.0% #88B9EA	RGB 136 185 234	#88B9EA
66.7%	66.7% #99BDEF	RGB 153 189 239	#99BDEF
83.3%	83.3% #AAC0F4	RGB 170 192 244	#AAC0F4
100.0%	100.0% #BBC4FA	RGB 187 196 250	#BBC4FA

#55AFDA #66B2DF #77B6E4 #88B9EA #99BDEF #AAC0F4 #BBC4FA

#55AFDA - #BBC4FA

HSV Blend

#55AFDA - #BBC4FA | 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 #55AFDA as 0% and #BBC4FA as 100%.

0.0%	0.0% #55AEDA	RGB 85 174 218	#55AEDA
16.7%	16.7% #64ACDF	RGB 100 172 223	#64ACDF
33.3%	33.3% #74ACE4	RGB 116 172 228	#74ACE4
50.0%	50.0% #85AEEA	RGB 133 174 234	#85AEEA
66.7%	66.7% #96B2EF	RGB 150 178 239	#96B2EF
83.3%	83.3% #A8BAF4	RGB 168 186 244	#A8BAF4
100.0%	100.0% #BBC4FA	RGB 187 196 250	#BBC4FA

#55AEDA #64ACDF #74ACE4 #85AEEA #96B2EF #A8BAF4 #BBC4FA

#55AFDA - #85AEEA - #BBC4FA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #55AEDA 0%, #85AEEA 50%, #BBC4FA 100%);
    background: -webkit-linear-gradient(top, #55AEDA 0%, #85AEEA 50%, #BBC4FA 100%);
    background: linear-gradient(to bottom, #55AEDA 0%, #85AEEA 50%, #BBC4FA 100%);
}
</style>