#60B5E1 - #CEDEDC | 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 #60B5E1 to #CEDEDC

#60B5E1 #CEDEDC

Calculate the color between two colors, #60B5E1 and #CEDEDC. 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)

#60B5E1 - #CEDEDC | 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 #60B5E1 as 0% and #CEDEDC as 100%.

0.0%	0.0% #60B5E1	RGB 96 181 225	#60B5E1
16.7%	16.7% #72BBE0	RGB 114 187 224	#72BBE0
33.3%	33.3% #84C2DF	RGB 132 194 223	#84C2DF
50.0%	50.0% #97C9DE	RGB 151 201 222	#97C9DE
66.7%	66.7% #A9D0DD	RGB 169 208 221	#A9D0DD
83.3%	83.3% #BBD7DC	RGB 187 215 220	#BBD7DC
100.0%	100.0% #CEDEDC	RGB 206 222 220	#CEDEDC

#60B5E1 #72BBE0 #84C2DF #97C9DE #A9D0DD #BBD7DC #CEDEDC

#60B5E1 - #CEDEDC

HSV Blend

#60B5E1 - #CEDEDC | 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 #60B5E1 as 0% and #CEDEDC as 100%.

0.0%	0.0% #60B4E1	RGB 96 180 225	#60B4E1
16.7%	16.7% #72C3E0	RGB 114 195 224	#72C3E0
33.3%	33.3% #85CFE0	RGB 133 207 224	#85CFE0
50.0%	50.0% #97D7DF	RGB 151 215 223	#97D7DF
66.7%	66.7% #A9DDDF	RGB 169 221 223	#A9DDDF
83.3%	83.3% #BBDEDC	RGB 187 222 220	#BBDEDC
100.0%	100.0% #CEDEDC	RGB 206 222 220	#CEDEDC

#60B4E1 #72C3E0 #85CFE0 #97D7DF #A9DDDF #BBDEDC #CEDEDC

#60B5E1 - #97D7DF - #CEDEDC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #60B4E1 0%, #97D7DF 50%, #CEDEDC 100%);
    background: -webkit-linear-gradient(top, #60B4E1 0%, #97D7DF 50%, #CEDEDC 100%);
    background: linear-gradient(to bottom, #60B4E1 0%, #97D7DF 50%, #CEDEDC 100%);
}
</style>