#5EACB2 - #CCCEC6 | 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 #5EACB2 to #CCCEC6

#5EACB2 #CCCEC6

Calculate the color between two colors, #5EACB2 and #CCCEC6. 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)

#5EACB2 - #CCCEC6 | 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 #5EACB2 as 0% and #CCCEC6 as 100%.

0.0%	0.0% #5EACB2	RGB 94 172 178	#5EACB2
16.7%	16.7% #70B1B5	RGB 112 177 181	#70B1B5
33.3%	33.3% #82B7B8	RGB 130 183 184	#82B7B8
50.0%	50.0% #95BDBC	RGB 149 189 188	#95BDBC
66.7%	66.7% #A7C2BF	RGB 167 194 191	#A7C2BF
83.3%	83.3% #B9C8C2	RGB 185 200 194	#B9C8C2
100.0%	100.0% #CCCEC6	RGB 204 206 198	#CCCEC6

#5EACB2 #70B1B5 #82B7B8 #95BDBC #A7C2BF #B9C8C2 #CCCEC6

#5EACB2 - #CCCEC6

HSV Blend

#5EACB2 - #CCCEC6 | 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 #5EACB2 as 0% and #CCCEC6 as 100%.

0.0%	0.0% #5EABB2	RGB 94 171 178	#5EABB2
16.7%	16.7% #6DB6A5	RGB 109 182 165	#6DB6A5
33.3%	33.3% #7DBB9A	RGB 125 187 154	#7DBB9A
50.0%	50.0% #8EC096	RGB 142 192 150	#8EC096
66.7%	66.7% #A5C4A0	RGB 165 196 160	#A5C4A0
83.3%	83.3% #BCC9B2	RGB 188 201 178	#BCC9B2
100.0%	100.0% #CCCEC6	RGB 204 206 198	#CCCEC6

#5EABB2 #6DB6A5 #7DBB9A #8EC096 #A5C4A0 #BCC9B2 #CCCEC6

#5EACB2 - #8EC096 - #CCCEC6

CSS codes

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

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