#B2DFEE - #5A97BE | 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 #B2DFEE to #5A97BE

#B2DFEE #5A97BE

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

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

0.0%	0.0% #B2DFEE	RGB 178 223 238	#B2DFEE
16.7%	16.7% #A3D3E6	RGB 163 211 230	#A3D3E6
33.3%	33.3% #94C7DE	RGB 148 199 222	#94C7DE
50.0%	50.0% #86BBD6	RGB 134 187 214	#86BBD6
66.7%	66.7% #77AFCE	RGB 119 175 206	#77AFCE
83.3%	83.3% #68A3C6	RGB 104 163 198	#68A3C6
100.0%	100.0% #5A97BE	RGB 90 151 190	#5A97BE

#B2DFEE #A3D3E6 #94C7DE #86BBD6 #77AFCE #68A3C6 #5A97BE

#B2DFEE - #5A97BE

HSV Blend

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

0.0%	0.0% #B2DFEE	RGB 178 223 238	#B2DFEE
16.7%	16.7% #A1D3E6	RGB 161 211 230	#A1D3E6
33.3%	33.3% #91C7DE	RGB 145 199 222	#91C7DE
50.0%	50.0% #82BBD6	RGB 130 187 214	#82BBD6
66.7%	66.7% #74AFCE	RGB 116 175 206	#74AFCE
83.3%	83.3% #66A3C6	RGB 102 163 198	#66A3C6
100.0%	100.0% #5A97BE	RGB 90 151 190	#5A97BE

#B2DFEE #A1D3E6 #91C7DE #82BBD6 #74AFCE #66A3C6 #5A97BE

#B2DFEE - #82BBD6 - #5A97BE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B2DFEE 0%, #82BBD6 50%, #5A97BE 100%);
    background: -webkit-linear-gradient(top, #B2DFEE 0%, #82BBD6 50%, #5A97BE 100%);
    background: linear-gradient(to bottom, #B2DFEE 0%, #82BBD6 50%, #5A97BE 100%);
}
</style>