#3E9CD1 - #B5D9DB | 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 #3E9CD1 to #B5D9DB

#3E9CD1 #B5D9DB

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

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

0.0%	0.0% #3E9CD1	RGB 62 156 209	#3E9CD1
16.7%	16.7% #51A6D2	RGB 81 166 210	#51A6D2
33.3%	33.3% #65B0D4	RGB 101 176 212	#65B0D4
50.0%	50.0% #79BAD6	RGB 121 186 214	#79BAD6
66.7%	66.7% #8DC4D7	RGB 141 196 215	#8DC4D7
83.3%	83.3% #A1CED9	RGB 161 206 217	#A1CED9
100.0%	100.0% #B5D9DB	RGB 181 217 219	#B5D9DB

#3E9CD1 #51A6D2 #65B0D4 #79BAD6 #8DC4D7 #A1CED9 #B5D9DB

#3E9CD1 - #B5D9DB

HSV Blend

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

0.0%	0.0% #3E9BD1	RGB 62 155 209	#3E9BD1
16.7%	16.7% #51AAD2	RGB 81 170 210	#51AAD2
33.3%	33.3% #64B7D4	RGB 100 183 212	#64B7D4
50.0%	50.0% #78C2D6	RGB 120 194 214	#78C2D6
66.7%	66.7% #8CCBD7	RGB 140 203 215	#8CCBD7
83.3%	83.3% #A0D3D9	RGB 160 211 217	#A0D3D9
100.0%	100.0% #B5D9DB	RGB 181 217 219	#B5D9DB

#3E9BD1 #51AAD2 #64B7D4 #78C2D6 #8CCBD7 #A0D3D9 #B5D9DB

#3E9CD1 - #78C2D6 - #B5D9DB

CSS codes

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

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