#6DCCD9 - #2582A2 | 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 #6DCCD9 to #2582A2

#6DCCD9 #2582A2

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

#6DCCD9 - #2582A2 | 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 #6DCCD9 as 0% and #2582A2 as 100%.

0.0%	0.0% #6DCCD9	RGB 109 204 217	#6DCCD9
16.7%	16.7% #61BFCF	RGB 97 191 207	#61BFCF
33.3%	33.3% #55B3C6	RGB 85 179 198	#55B3C6
50.0%	50.0% #49A7BD	RGB 73 167 189	#49A7BD
66.7%	66.7% #3D9AB4	RGB 61 154 180	#3D9AB4
83.3%	83.3% #318EAB	RGB 49 142 171	#318EAB
100.0%	100.0% #2582A2	RGB 37 130 162	#2582A2

#6DCCD9 #61BFCF #55B3C6 #49A7BD #3D9AB4 #318EAB #2582A2

#6DCCD9 - #2582A2

HSV Blend

#6DCCD9 - #2582A2 | 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 #6DCCD9 as 0% and #2582A2 as 100%.

0.0%	0.0% #6DCCD9	RGB 109 204 217	#6DCCD9
16.7%	16.7% #5EBFCF	RGB 94 191 207	#5EBFCF
33.3%	33.3% #51B3C6	RGB 81 179 198	#51B3C6
50.0%	50.0% #45A6BD	RGB 69 166 189	#45A6BD
66.7%	66.7% #399AB4	RGB 57 154 180	#399AB4
83.3%	83.3% #2E8EAB	RGB 46 142 171	#2E8EAB
100.0%	100.0% #2582A2	RGB 37 130 162	#2582A2

#6DCCD9 #5EBFCF #51B3C6 #45A6BD #399AB4 #2E8EAB #2582A2

#6DCCD9 - #45A6BD - #2582A2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6DCCD9 0%, #45A6BD 50%, #2582A2 100%);
    background: -webkit-linear-gradient(top, #6DCCD9 0%, #45A6BD 50%, #2582A2 100%);
    background: linear-gradient(to bottom, #6DCCD9 0%, #45A6BD 50%, #2582A2 100%);
}
</style>