#358CB2 - #8EC9D5 | 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 #358CB2 to #8EC9D5

#358CB2 #8EC9D5

Calculate the color between two colors, #358CB2 and #8EC9D5. 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)

#358CB2 - #8EC9D5 | 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 #358CB2 as 0% and #8EC9D5 as 100%.

0.0%	0.0% #358CB2	RGB 53 140 178	#358CB2
16.7%	16.7% #4396B7	RGB 67 150 183	#4396B7
33.3%	33.3% #52A0BD	RGB 82 160 189	#52A0BD
50.0%	50.0% #61AAC3	RGB 97 170 195	#61AAC3
66.7%	66.7% #70B4C9	RGB 112 180 201	#70B4C9
83.3%	83.3% #7FBECF	RGB 127 190 207	#7FBECF
100.0%	100.0% #8EC9D5	RGB 142 201 213	#8EC9D5

#358CB2 #4396B7 #52A0BD #61AAC3 #70B4C9 #7FBECF #8EC9D5

#358CB2 - #8EC9D5

HSV Blend

#358CB2 - #8EC9D5 | 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 #358CB2 as 0% and #8EC9D5 as 100%.

0.0%	0.0% #358BB2	RGB 53 139 178	#358BB2
16.7%	16.7% #4296B7	RGB 66 150 183	#4296B7
33.3%	33.3% #4FA1BD	RGB 79 161 189	#4FA1BD
50.0%	50.0% #5EABC3	RGB 94 171 195	#5EABC3
66.7%	66.7% #6DB5C9	RGB 109 181 201	#6DB5C9
83.3%	83.3% #7DBFCF	RGB 125 191 207	#7DBFCF
100.0%	100.0% #8EC9D5	RGB 142 201 213	#8EC9D5

#358BB2 #4296B7 #4FA1BD #5EABC3 #6DB5C9 #7DBFCF #8EC9D5

#358CB2 - #5EABC3 - #8EC9D5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #358BB2 0%, #5EABC3 50%, #8EC9D5 100%);
    background: -webkit-linear-gradient(top, #358BB2 0%, #5EABC3 50%, #8EC9D5 100%);
    background: linear-gradient(to bottom, #358BB2 0%, #5EABC3 50%, #8EC9D5 100%);
}
</style>