#3E6ED1 - #B5CCDB | 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 #3E6ED1 to #B5CCDB

#3E6ED1 #B5CCDB

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

#3E6ED1 - #B5CCDB | 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 #3E6ED1 as 0% and #B5CCDB as 100%.

0.0%	0.0% #3E6ED1	RGB 62 110 209	#3E6ED1
16.7%	16.7% #517DD2	RGB 81 125 210	#517DD2
33.3%	33.3% #658DD4	RGB 101 141 212	#658DD4
50.0%	50.0% #799DD6	RGB 121 157 214	#799DD6
66.7%	66.7% #8DACD7	RGB 141 172 215	#8DACD7
83.3%	83.3% #A1BCD9	RGB 161 188 217	#A1BCD9
100.0%	100.0% #B5CCDB	RGB 181 204 219	#B5CCDB

#3E6ED1 #517DD2 #658DD4 #799DD6 #8DACD7 #A1BCD9 #B5CCDB

#3E6ED1 - #B5CCDB

HSV Blend

#3E6ED1 - #B5CCDB | 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 #3E6ED1 as 0% and #B5CCDB as 100%.

0.0%	0.0% #3E6ED1	RGB 62 110 209	#3E6ED1
16.7%	16.7% #5181D2	RGB 81 129 210	#5181D2
33.3%	33.3% #6493D4	RGB 100 147 212	#6493D4
50.0%	50.0% #78A3D6	RGB 120 163 214	#78A3D6
66.7%	66.7% #8CB2D7	RGB 140 178 215	#8CB2D7
83.3%	83.3% #A0C0D9	RGB 160 192 217	#A0C0D9
100.0%	100.0% #B5CCDB	RGB 181 204 219	#B5CCDB

#3E6ED1 #5181D2 #6493D4 #78A3D6 #8CB2D7 #A0C0D9 #B5CCDB

#3E6ED1 - #78A3D6 - #B5CCDB

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3E6ED1 0%, #78A3D6 50%, #B5CCDB 100%);
    background: -webkit-linear-gradient(top, #3E6ED1 0%, #78A3D6 50%, #B5CCDB 100%);
    background: linear-gradient(to bottom, #3E6ED1 0%, #78A3D6 50%, #B5CCDB 100%);
}
</style>