#FF87F3 - #CF0DC2 | 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 #FF87F3 to #CF0DC2

#FF87F3 #CF0DC2

Calculate the color between two colors, #FF87F3 and #CF0DC2. 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)

#FF87F3 - #CF0DC2 | 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 #FF87F3 as 0% and #CF0DC2 as 100%.

0.0%	0.0% #FF87F3	RGB 255 135 243	#FF87F3
16.7%	16.7% #F772EA	RGB 247 114 234	#F772EA
33.3%	33.3% #EF5EE2	RGB 239 94 226	#EF5EE2
50.0%	50.0% #E74ADA	RGB 231 74 218	#E74ADA
66.7%	66.7% #DF35D2	RGB 223 53 210	#DF35D2
83.3%	83.3% #D721CA	RGB 215 33 202	#D721CA
100.0%	100.0% #CF0DC2	RGB 207 13 194	#CF0DC2

#FF87F3 #F772EA #EF5EE2 #E74ADA #DF35D2 #D721CA #CF0DC2

#FF87F3 - #CF0DC2

HSV Blend

#FF87F3 - #CF0DC2 | 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 #FF87F3 as 0% and #CF0DC2 as 100%.

0.0%	0.0% #FF87F3	RGB 255 135 243	#FF87F3
16.7%	16.7% #F76FEA	RGB 247 111 234	#F76FEA
33.3%	33.3% #EF59E1	RGB 239 89 225	#EF59E1
50.0%	50.0% #E744D9	RGB 231 68 217	#E744D9
66.7%	66.7% #DF30D1	RGB 223 48 209	#DF30D1
83.3%	83.3% #D71EC9	RGB 215 30 201	#D71EC9
100.0%	100.0% #CF0DC2	RGB 207 13 194	#CF0DC2

#FF87F3 #F76FEA #EF59E1 #E744D9 #DF30D1 #D71EC9 #CF0DC2

#FF87F3 - #E744D9 - #CF0DC2

CSS codes

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

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