#478CFF - #8FFFC7 | 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 #478CFF to #8FFFC7

#478CFF #8FFFC7

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

#478CFF - #8FFFC7 | 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 #478CFF as 0% and #8FFFC7 as 100%.

0.0%	0.0% #478CFF	RGB 71 140 255	#478CFF
16.7%	16.7% #539FF5	RGB 83 159 245	#539FF5
33.3%	33.3% #5FB2EC	RGB 95 178 236	#5FB2EC
50.0%	50.0% #6BC5E3	RGB 107 197 227	#6BC5E3
66.7%	66.7% #77D8D9	RGB 119 216 217	#77D8D9
83.3%	83.3% #83EBD0	RGB 131 235 208	#83EBD0
100.0%	100.0% #8FFFC7	RGB 143 255 199	#8FFFC7

#478CFF #539FF5 #5FB2EC #6BC5E3 #77D8D9 #83EBD0 #8FFFC7

#478CFF - #8FFFC7

HSV Blend

#478CFF - #8FFFC7 | 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 #478CFF as 0% and #8FFFC7 as 100%.

0.0%	0.0% #478BFF	RGB 71 139 255	#478BFF
16.7%	16.7% #53B3FF	RGB 83 179 255	#53B3FF
33.3%	33.3% #5FD6FF	RGB 95 214 255	#5FD6FF
50.0%	50.0% #6BF5FF	RGB 107 245 255	#6BF5FF
66.7%	66.7% #77FFEE	RGB 119 255 238	#77FFEE
83.3%	83.3% #83FFD8	RGB 131 255 216	#83FFD8
100.0%	100.0% #8FFFC7	RGB 143 255 199	#8FFFC7

#478BFF #53B3FF #5FD6FF #6BF5FF #77FFEE #83FFD8 #8FFFC7

#478CFF - #6BF5FF - #8FFFC7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #478BFF 0%, #6BF5FF 50%, #8FFFC7 100%);
    background: -webkit-linear-gradient(top, #478BFF 0%, #6BF5FF 50%, #8FFFC7 100%);
    background: linear-gradient(to bottom, #478BFF 0%, #6BF5FF 50%, #8FFFC7 100%);
}
</style>