#8AFFF4 - #ECE3E4 | 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 #8AFFF4 to #ECE3E4

#8AFFF4 #ECE3E4

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

#8AFFF4 - #ECE3E4 | 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 #8AFFF4 as 0% and #ECE3E4 as 100%.

0.0%	0.0% #8AFFF4	RGB 138 255 244	#8AFFF4
16.7%	16.7% #9AFAF1	RGB 154 250 241	#9AFAF1
33.3%	33.3% #AAF5EE	RGB 170 245 238	#AAF5EE
50.0%	50.0% #BBF1EC	RGB 187 241 236	#BBF1EC
66.7%	66.7% #CBECE9	RGB 203 236 233	#CBECE9
83.3%	83.3% #DBE7E6	RGB 219 231 230	#DBE7E6
100.0%	100.0% #ECE3E4	RGB 236 227 228	#ECE3E4

#8AFFF4 #9AFAF1 #AAF5EE #BBF1EC #CBECE9 #DBE7E6 #ECE3E4

#8AFFF4 - #ECE3E4

HSV Blend

#8AFFF4 - #ECE3E4 | 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 #8AFFF4 as 0% and #ECE3E4 as 100%.

0.0%	0.0% #8AFFF4	RGB 138 255 244	#8AFFF4
16.7%	16.7% #99D4FB	RGB 153 212 251	#99D4FB
33.3%	33.3% #A9B1F8	RGB 169 177 248	#A9B1F8
50.0%	50.0% #D0B8F5	RGB 208 184 245	#D0B8F5
66.7%	66.7% #EDC7F2	RGB 237 199 242	#EDC7F2
83.3%	83.3% #EFD5E5	RGB 239 213 229	#EFD5E5
100.0%	100.0% #ECE3E4	RGB 236 227 228	#ECE3E4

#8AFFF4 #99D4FB #A9B1F8 #D0B8F5 #EDC7F2 #EFD5E5 #ECE3E4

#8AFFF4 - #D0B8F5 - #ECE3E4

CSS codes

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

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