#5DF9FF - #BDD0FF | 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 #5DF9FF to #BDD0FF

#5DF9FF #BDD0FF

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

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

0.0%	0.0% #5DF9FF	RGB 93 249 255	#5DF9FF
16.7%	16.7% #6DF2FF	RGB 109 242 255	#6DF2FF
33.3%	33.3% #7DEBFF	RGB 125 235 255	#7DEBFF
50.0%	50.0% #8DE4FF	RGB 141 228 255	#8DE4FF
66.7%	66.7% #9DDDFF	RGB 157 221 255	#9DDDFF
83.3%	83.3% #ADD6FF	RGB 173 214 255	#ADD6FF
100.0%	100.0% #BDD0FF	RGB 189 208 255	#BDD0FF

#5DF9FF #6DF2FF #7DEBFF #8DE4FF #9DDDFF #ADD6FF #BDD0FF

#5DF9FF - #BDD0FF

HSV Blend

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

0.0%	0.0% #5DF9FF	RGB 93 249 255	#5DF9FF
16.7%	16.7% #6DE9FF	RGB 109 233 255	#6DE9FF
33.3%	33.3% #7DDCFF	RGB 125 220 255	#7DDCFF
50.0%	50.0% #8DD4FF	RGB 141 212 255	#8DD4FF
66.7%	66.7% #9DCFFF	RGB 157 207 255	#9DCFFF
83.3%	83.3% #ADCDFF	RGB 173 205 255	#ADCDFF
100.0%	100.0% #BDD0FF	RGB 189 208 255	#BDD0FF

#5DF9FF #6DE9FF #7DDCFF #8DD4FF #9DCFFF #ADCDFF #BDD0FF

#5DF9FF - #8DD4FF - #BDD0FF

CSS codes

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

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