#5A81C2 - #CFDAED | 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 #5A81C2 to #CFDAED

#5A81C2 #CFDAED

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

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

0.0%	0.0% #5A81C2	RGB 90 129 194	#5A81C2
16.7%	16.7% #6D8FC9	RGB 109 143 201	#6D8FC9
33.3%	33.3% #819ED0	RGB 129 158 208	#819ED0
50.0%	50.0% #94ADD7	RGB 148 173 215	#94ADD7
66.7%	66.7% #A8BCDE	RGB 168 188 222	#A8BCDE
83.3%	83.3% #BBCBE5	RGB 187 203 229	#BBCBE5
100.0%	100.0% #CFDAED	RGB 207 218 237	#CFDAED

#5A81C2 #6D8FC9 #819ED0 #94ADD7 #A8BCDE #BBCBE5 #CFDAED

#5A81C2 - #CFDAED

HSV Blend

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

0.0%	0.0% #5A80C2	RGB 90 128 194	#5A80C2
16.7%	16.7% #6B8EC9	RGB 107 142 201	#6B8EC9
33.3%	33.3% #7D9CD0	RGB 125 156 208	#7D9CD0
50.0%	50.0% #90AAD7	RGB 144 170 215	#90AAD7
66.7%	66.7% #A4B9DE	RGB 164 185 222	#A4B9DE
83.3%	83.3% #B9C9E5	RGB 185 201 229	#B9C9E5
100.0%	100.0% #CFDAED	RGB 207 218 237	#CFDAED

#5A80C2 #6B8EC9 #7D9CD0 #90AAD7 #A4B9DE #B9C9E5 #CFDAED

#5A81C2 - #90AAD7 - #CFDAED

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5A80C2 0%, #90AAD7 50%, #CFDAED 100%);
    background: -webkit-linear-gradient(top, #5A80C2 0%, #90AAD7 50%, #CFDAED 100%);
    background: linear-gradient(to bottom, #5A80C2 0%, #90AAD7 50%, #CFDAED 100%);
}
</style>