#5656A2 - #CECEE4 | 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 #5656A2 to #CECEE4

#5656A2 #CECEE4

Calculate the color between two colors, #5656A2 and #CECEE4. 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)

#5656A2 - #CECEE4 | 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 #5656A2 as 0% and #CECEE4 as 100%.

0.0%	0.0% #5656A2	RGB 86 86 162	#5656A2
16.7%	16.7% #6A6AAD	RGB 106 106 173	#6A6AAD
33.3%	33.3% #7E7EB8	RGB 126 126 184	#7E7EB8
50.0%	50.0% #9292C3	RGB 146 146 195	#9292C3
66.7%	66.7% #A6A6CE	RGB 166 166 206	#A6A6CE
83.3%	83.3% #BABAD9	RGB 186 186 217	#BABAD9
100.0%	100.0% #CECEE4	RGB 206 206 228	#CECEE4

#5656A2 #6A6AAD #7E7EB8 #9292C3 #A6A6CE #BABAD9 #CECEE4

#5656A2 - #CECEE4

HSV Blend

#5656A2 - #CECEE4 | 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 #5656A2 as 0% and #CECEE4 as 100%.

0.0%	0.0% #5656A2	RGB 86 86 162	#5656A2
16.7%	16.7% #6666AD	RGB 102 102 173	#6666AD
33.3%	33.3% #7878B8	RGB 120 120 184	#7878B8
50.0%	50.0% #8B8BC3	RGB 139 139 195	#8B8BC3
66.7%	66.7% #A0A0CE	RGB 160 160 206	#A0A0CE
83.3%	83.3% #B6B6D9	RGB 182 182 217	#B6B6D9
100.0%	100.0% #CECEE4	RGB 206 206 228	#CECEE4

#5656A2 #6666AD #7878B8 #8B8BC3 #A0A0CE #B6B6D9 #CECEE4

#5656A2 - #8B8BC3 - #CECEE4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5656A2 0%, #8B8BC3 50%, #CECEE4 100%);
    background: -webkit-linear-gradient(top, #5656A2 0%, #8B8BC3 50%, #CECEE4 100%);
    background: linear-gradient(to bottom, #5656A2 0%, #8B8BC3 50%, #CECEE4 100%);
}
</style>