#5DB2FF - #B4DBEC | 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 #5DB2FF to #B4DBEC

#5DB2FF #B4DBEC

Calculate the color between two colors, #5DB2FF and #B4DBEC. 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)

#5DB2FF - #B4DBEC | 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 #5DB2FF as 0% and #B4DBEC as 100%.

0.0%	0.0% #5DB2FF	RGB 93 178 255	#5DB2FF
16.7%	16.7% #6BB8FB	RGB 107 184 251	#6BB8FB
33.3%	33.3% #7ABFF8	RGB 122 191 248	#7ABFF8
50.0%	50.0% #88C6F5	RGB 136 198 245	#88C6F5
66.7%	66.7% #97CDF2	RGB 151 205 242	#97CDF2
83.3%	83.3% #A5D4EF	RGB 165 212 239	#A5D4EF
100.0%	100.0% #B4DBEC	RGB 180 219 236	#B4DBEC

#5DB2FF #6BB8FB #7ABFF8 #88C6F5 #97CDF2 #A5D4EF #B4DBEC

#5DB2FF - #B4DBEC

HSV Blend

#5DB2FF - #B4DBEC | 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 #5DB2FF as 0% and #B4DBEC as 100%.

0.0%	0.0% #5DB2FF	RGB 93 178 255	#5DB2FF
16.7%	16.7% #6CBBFB	RGB 108 187 251	#6CBBFB
33.3%	33.3% #7BC4F8	RGB 123 196 248	#7BC4F8
50.0%	50.0% #8ACBF5	RGB 138 203 245	#8ACBF5
66.7%	66.7% #98D1F2	RGB 152 209 242	#98D1F2
83.3%	83.3% #A6D7EF	RGB 166 215 239	#A6D7EF
100.0%	100.0% #B4DBEC	RGB 180 219 236	#B4DBEC

#5DB2FF #6CBBFB #7BC4F8 #8ACBF5 #98D1F2 #A6D7EF #B4DBEC

#5DB2FF - #8ACBF5 - #B4DBEC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5DB2FF 0%, #8ACBF5 50%, #B4DBEC 100%);
    background: -webkit-linear-gradient(top, #5DB2FF 0%, #8ACBF5 50%, #B4DBEC 100%);
    background: linear-gradient(to bottom, #5DB2FF 0%, #8ACBF5 50%, #B4DBEC 100%);
}
</style>