#ADE1E6 - #313F41 | 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 #ADE1E6 to #313F41

#ADE1E6 #313F41

Calculate the color between two colors, #ADE1E6 and #313F41. 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)

#ADE1E6 - #313F41 | 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 #ADE1E6 as 0% and #313F41 as 100%.

0.0%	0.0% #ADE1E6	RGB 173 225 230	#ADE1E6
16.7%	16.7% #98C6CA	RGB 152 198 202	#98C6CA
33.3%	33.3% #83ABAF	RGB 131 171 175	#83ABAF
50.0%	50.0% #6F9093	RGB 111 144 147	#6F9093
66.7%	66.7% #5A7578	RGB 90 117 120	#5A7578
83.3%	83.3% #455A5C	RGB 69 90 92	#455A5C
100.0%	100.0% #313F41	RGB 49 63 65	#313F41

#ADE1E6 #98C6CA #83ABAF #6F9093 #5A7578 #455A5C #313F41

#ADE1E6 - #313F41

HSV Blend

#ADE1E6 - #313F41 | 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 #ADE1E6 as 0% and #313F41 as 100%.

0.0%	0.0% #ADE1E6	RGB 173 225 230	#ADE1E6
16.7%	16.7% #98C5CA	RGB 152 197 202	#98C5CA
33.3%	33.3% #83AAAF	RGB 131 170 175	#83AAAF
50.0%	50.0% #6F8F93	RGB 111 143 147	#6F8F93
66.7%	66.7% #5A7478	RGB 90 116 120	#5A7478
83.3%	83.3% #45595C	RGB 69 89 92	#45595C
100.0%	100.0% #313F41	RGB 49 63 65	#313F41

#ADE1E6 #98C5CA #83AAAF #6F8F93 #5A7478 #45595C #313F41

#ADE1E6 - #6F8F93 - #313F41

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ADE1E6 0%, #6F8F93 50%, #313F41 100%);
    background: -webkit-linear-gradient(top, #ADE1E6 0%, #6F8F93 50%, #313F41 100%);
    background: linear-gradient(to bottom, #ADE1E6 0%, #6F8F93 50%, #313F41 100%);
}
</style>