#3C5EBB - #86ACDE | 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 #3C5EBB to #86ACDE

#3C5EBB #86ACDE

Calculate the color between two colors, #3C5EBB and #86ACDE. 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)

#3C5EBB - #86ACDE | 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 #3C5EBB as 0% and #86ACDE as 100%.

0.0%	0.0% #3C5EBB	RGB 60 94 187	#3C5EBB
16.7%	16.7% #486BC0	RGB 72 107 192	#486BC0
33.3%	33.3% #5478C6	RGB 84 120 198	#5478C6
50.0%	50.0% #6185CC	RGB 97 133 204	#6185CC
66.7%	66.7% #6D92D2	RGB 109 146 210	#6D92D2
83.3%	83.3% #799FD8	RGB 121 159 216	#799FD8
100.0%	100.0% #86ACDE	RGB 134 172 222	#86ACDE

#3C5EBB #486BC0 #5478C6 #6185CC #6D92D2 #799FD8 #86ACDE

#3C5EBB - #86ACDE

HSV Blend

#3C5EBB - #86ACDE | 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 #3C5EBB as 0% and #86ACDE as 100%.

0.0%	0.0% #3C5EBB	RGB 60 94 187	#3C5EBB
16.7%	16.7% #466AC0	RGB 70 106 192	#466AC0
33.3%	33.3% #5277C6	RGB 82 119 198	#5277C6
50.0%	50.0% #5E84CC	RGB 94 132 204	#5E84CC
66.7%	66.7% #6B92D2	RGB 107 146 210	#6B92D2
83.3%	83.3% #789FD8	RGB 120 159 216	#789FD8
100.0%	100.0% #86ACDE	RGB 134 172 222	#86ACDE

#3C5EBB #466AC0 #5277C6 #5E84CC #6B92D2 #789FD8 #86ACDE

#3C5EBB - #5E84CC - #86ACDE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C5EBB 0%, #5E84CC 50%, #86ACDE 100%);
    background: -webkit-linear-gradient(top, #3C5EBB 0%, #5E84CC 50%, #86ACDE 100%);
    background: linear-gradient(to bottom, #3C5EBB 0%, #5E84CC 50%, #86ACDE 100%);
}
</style>