#FF026C - #FF777E | 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 #FF026C to #FF777E

#FF026C #FF777E

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

#FF026C - #FF777E | 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 #FF026C as 0% and #FF777E as 100%.

0.0%	0.0% #FF026C	RGB 255 2 108	#FF026C
16.7%	16.7% #FF156F	RGB 255 21 111	#FF156F
33.3%	33.3% #FF2972	RGB 255 41 114	#FF2972
50.0%	50.0% #FF3C75	RGB 255 60 117	#FF3C75
66.7%	66.7% #FF5078	RGB 255 80 120	#FF5078
83.3%	83.3% #FF637B	RGB 255 99 123	#FF637B
100.0%	100.0% #FF777E	RGB 255 119 126	#FF777E

#FF026C #FF156F #FF2972 #FF3C75 #FF5078 #FF637B #FF777E

#FF026C - #FF777E

HSV Blend

#FF026C - #FF777E | 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 #FF026C as 0% and #FF777E as 100%.

0.0%	0.0% #FF016C	RGB 255 1 108	#FF016C
16.7%	16.7% #FF1569	RGB 255 21 105	#FF1569
33.3%	33.3% #FF2868	RGB 255 40 104	#FF2868
50.0%	50.0% #FF3C6A	RGB 255 60 106	#FF3C6A
66.7%	66.7% #FF506E	RGB 255 80 110	#FF506E
83.3%	83.3% #FF6375	RGB 255 99 117	#FF6375
100.0%	100.0% #FF777E	RGB 255 119 126	#FF777E

#FF016C #FF1569 #FF2868 #FF3C6A #FF506E #FF6375 #FF777E

#FF026C - #FF3C6A - #FF777E

CSS codes

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

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