#7ED3E2 - #2D88A8 | 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 #7ED3E2 to #2D88A8

#7ED3E2 #2D88A8

Calculate the color between two colors, #7ED3E2 and #2D88A8. 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)

#7ED3E2 - #2D88A8 | 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 #7ED3E2 as 0% and #2D88A8 as 100%.

0.0%	0.0% #7ED3E2	RGB 126 211 226	#7ED3E2
16.7%	16.7% #70C6D8	RGB 112 198 216	#70C6D8
33.3%	33.3% #63BACE	RGB 99 186 206	#63BACE
50.0%	50.0% #55ADC5	RGB 85 173 197	#55ADC5
66.7%	66.7% #48A1BB	RGB 72 161 187	#48A1BB
83.3%	83.3% #3A94B1	RGB 58 148 177	#3A94B1
100.0%	100.0% #2D88A8	RGB 45 136 168	#2D88A8

#7ED3E2 #70C6D8 #63BACE #55ADC5 #48A1BB #3A94B1 #2D88A8

#7ED3E2 - #2D88A8

HSV Blend

#7ED3E2 - #2D88A8 | 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 #7ED3E2 as 0% and #2D88A8 as 100%.

0.0%	0.0% #7ED3E2	RGB 126 211 226	#7ED3E2
16.7%	16.7% #6EC6D8	RGB 110 198 216	#6EC6D8
33.3%	33.3% #5FB9CE	RGB 95 185 206	#5FB9CE
50.0%	50.0% #51ADC5	RGB 81 173 197	#51ADC5
66.7%	66.7% #44A0BB	RGB 68 160 187	#44A0BB
83.3%	83.3% #3894B1	RGB 56 148 177	#3894B1
100.0%	100.0% #2D88A8	RGB 45 136 168	#2D88A8

#7ED3E2 #6EC6D8 #5FB9CE #51ADC5 #44A0BB #3894B1 #2D88A8

#7ED3E2 - #51ADC5 - #2D88A8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #7ED3E2 0%, #51ADC5 50%, #2D88A8 100%);
    background: -webkit-linear-gradient(top, #7ED3E2 0%, #51ADC5 50%, #2D88A8 100%);
    background: linear-gradient(to bottom, #7ED3E2 0%, #51ADC5 50%, #2D88A8 100%);
}
</style>