#3E9ACE - #B5D8DA | 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 #3E9ACE to #B5D8DA

#3E9ACE #B5D8DA

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

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

0.0%	0.0% #3E9ACE	RGB 62 154 206	#3E9ACE
16.7%	16.7% #51A4D0	RGB 81 164 208	#51A4D0
33.3%	33.3% #65AED2	RGB 101 174 210	#65AED2
50.0%	50.0% #79B9D4	RGB 121 185 212	#79B9D4
66.7%	66.7% #8DC3D6	RGB 141 195 214	#8DC3D6
83.3%	83.3% #A1CDD8	RGB 161 205 216	#A1CDD8
100.0%	100.0% #B5D8DA	RGB 181 216 218	#B5D8DA

#3E9ACE #51A4D0 #65AED2 #79B9D4 #8DC3D6 #A1CDD8 #B5D8DA

#3E9ACE - #B5D8DA

HSV Blend

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

0.0%	0.0% #3E9ACE	RGB 62 154 206	#3E9ACE
16.7%	16.7% #50A8D0	RGB 80 168 208	#50A8D0
33.3%	33.3% #64B5D2	RGB 100 181 210	#64B5D2
50.0%	50.0% #77C0D4	RGB 119 192 212	#77C0D4
66.7%	66.7% #8BCAD6	RGB 139 202 214	#8BCAD6
83.3%	83.3% #A0D2D8	RGB 160 210 216	#A0D2D8
100.0%	100.0% #B5D8DA	RGB 181 216 218	#B5D8DA

#3E9ACE #50A8D0 #64B5D2 #77C0D4 #8BCAD6 #A0D2D8 #B5D8DA

#3E9ACE - #77C0D4 - #B5D8DA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3E9ACE 0%, #77C0D4 50%, #B5D8DA 100%);
    background: -webkit-linear-gradient(top, #3E9ACE 0%, #77C0D4 50%, #B5D8DA 100%);
    background: linear-gradient(to bottom, #3E9ACE 0%, #77C0D4 50%, #B5D8DA 100%);
}
</style>