#A2D3DA - #5187A2 | 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 #A2D3DA to #5187A2

#A2D3DA #5187A2

Calculate the color between two colors, #A2D3DA and #5187A2. 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)

#A2D3DA - #5187A2 | 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 #A2D3DA as 0% and #5187A2 as 100%.

0.0%	0.0% #A2D3DA	RGB 162 211 218	#A2D3DA
16.7%	16.7% #94C6D0	RGB 148 198 208	#94C6D0
33.3%	33.3% #87B9C7	RGB 135 185 199	#87B9C7
50.0%	50.0% #79ADBE	RGB 121 173 190	#79ADBE
66.7%	66.7% #6CA0B4	RGB 108 160 180	#6CA0B4
83.3%	83.3% #5E93AB	RGB 94 147 171	#5E93AB
100.0%	100.0% #5187A2	RGB 81 135 162	#5187A2

#A2D3DA #94C6D0 #87B9C7 #79ADBE #6CA0B4 #5E93AB #5187A2

#A2D3DA - #5187A2

HSV Blend

#A2D3DA - #5187A2 | 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 #A2D3DA as 0% and #5187A2 as 100%.

0.0%	0.0% #A2D3DA	RGB 162 211 218	#A2D3DA
16.7%	16.7% #92C6D0	RGB 146 198 208	#92C6D0
33.3%	33.3% #83BAC7	RGB 131 186 199	#83BAC7
50.0%	50.0% #76ADBE	RGB 118 173 190	#76ADBE
66.7%	66.7% #68A0B4	RGB 104 160 180	#68A0B4
83.3%	83.3% #5C93AB	RGB 92 147 171	#5C93AB
100.0%	100.0% #5187A2	RGB 81 135 162	#5187A2

#A2D3DA #92C6D0 #83BAC7 #76ADBE #68A0B4 #5C93AB #5187A2

#A2D3DA - #76ADBE - #5187A2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A2D3DA 0%, #76ADBE 50%, #5187A2 100%);
    background: -webkit-linear-gradient(top, #A2D3DA 0%, #76ADBE 50%, #5187A2 100%);
    background: linear-gradient(to bottom, #A2D3DA 0%, #76ADBE 50%, #5187A2 100%);
}
</style>