#4F5E9C - #CCD0E2 | 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 #4F5E9C to #CCD0E2

#4F5E9C #CCD0E2

Calculate the color between two colors, #4F5E9C and #CCD0E2. 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)

#4F5E9C - #CCD0E2 | 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 #4F5E9C as 0% and #CCD0E2 as 100%.

0.0%	0.0% #4F5E9C	RGB 79 94 156	#4F5E9C
16.7%	16.7% #6371A7	RGB 99 113 167	#6371A7
33.3%	33.3% #7884B3	RGB 120 132 179	#7884B3
50.0%	50.0% #8D97BF	RGB 141 151 191	#8D97BF
66.7%	66.7% #A2AACA	RGB 162 170 202	#A2AACA
83.3%	83.3% #B7BDD6	RGB 183 189 214	#B7BDD6
100.0%	100.0% #CCD0E2	RGB 204 208 226	#CCD0E2

#4F5E9C #6371A7 #7884B3 #8D97BF #A2AACA #B7BDD6 #CCD0E2

#4F5E9C - #CCD0E2

HSV Blend

#4F5E9C - #CCD0E2 | 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 #4F5E9C as 0% and #CCD0E2 as 100%.

0.0%	0.0% #4F5D9C	RGB 79 93 156	#4F5D9C
16.7%	16.7% #5F6DA7	RGB 95 109 167	#5F6DA7
33.3%	33.3% #727EB3	RGB 114 126 179	#727EB3
50.0%	50.0% #8691BF	RGB 134 145 191	#8691BF
66.7%	66.7% #9CA4CA	RGB 156 164 202	#9CA4CA
83.3%	83.3% #B3B9D6	RGB 179 185 214	#B3B9D6
100.0%	100.0% #CCD0E2	RGB 204 208 226	#CCD0E2

#4F5D9C #5F6DA7 #727EB3 #8691BF #9CA4CA #B3B9D6 #CCD0E2

#4F5E9C - #8691BF - #CCD0E2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4F5D9C 0%, #8691BF 50%, #CCD0E2 100%);
    background: -webkit-linear-gradient(top, #4F5D9C 0%, #8691BF 50%, #CCD0E2 100%);
    background: linear-gradient(to bottom, #4F5D9C 0%, #8691BF 50%, #CCD0E2 100%);
}
</style>