#5E86AA - #A5DAA3 | 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 #5E86AA to #A5DAA3

#5E86AA #A5DAA3

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

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

0.0%	0.0% #5E86AA	RGB 94 134 170	#5E86AA
16.7%	16.7% #6994A8	RGB 105 148 168	#6994A8
33.3%	33.3% #75A2A7	RGB 117 162 167	#75A2A7
50.0%	50.0% #81B0A6	RGB 129 176 166	#81B0A6
66.7%	66.7% #8DBEA5	RGB 141 190 165	#8DBEA5
83.3%	83.3% #99CCA4	RGB 153 204 164	#99CCA4
100.0%	100.0% #A5DAA3	RGB 165 218 163	#A5DAA3

#5E86AA #6994A8 #75A2A7 #81B0A6 #8DBEA5 #99CCA4 #A5DAA3

#5E86AA - #A5DAA3

HSV Blend

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

0.0%	0.0% #5E86AA	RGB 94 134 170	#5E86AA
16.7%	16.7% #68A1B2	RGB 104 161 178	#68A1B2
33.3%	33.3% #72BAB7	RGB 114 186 183	#72BAB7
50.0%	50.0% #7EC2AE	RGB 126 194 174	#7EC2AE
66.7%	66.7% #89CAA7	RGB 137 202 167	#89CAA7
83.3%	83.3% #96D2A3	RGB 150 210 163	#96D2A3
100.0%	100.0% #A5DAA3	RGB 165 218 163	#A5DAA3

#5E86AA #68A1B2 #72BAB7 #7EC2AE #89CAA7 #96D2A3 #A5DAA3

#5E86AA - #7EC2AE - #A5DAA3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E86AA 0%, #7EC2AE 50%, #A5DAA3 100%);
    background: -webkit-linear-gradient(top, #5E86AA 0%, #7EC2AE 50%, #A5DAA3 100%);
    background: linear-gradient(to bottom, #5E86AA 0%, #7EC2AE 50%, #A5DAA3 100%);
}
</style>