#C3CDF4 - #617EC4 | 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 #C3CDF4 to #617EC4

#C3CDF4 #617EC4

Calculate the color between two colors, #C3CDF4 and #617EC4. 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)

#C3CDF4 - #617EC4 | 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 #C3CDF4 as 0% and #617EC4 as 100%.

0.0%	0.0% #C3CDF4	RGB 195 205 244	#C3CDF4
16.7%	16.7% #B2BFEC	RGB 178 191 236	#B2BFEC
33.3%	33.3% #A2B2E4	RGB 162 178 228	#A2B2E4
50.0%	50.0% #92A5DC	RGB 146 165 220	#92A5DC
66.7%	66.7% #8198D4	RGB 129 152 212	#8198D4
83.3%	83.3% #718BCC	RGB 113 139 204	#718BCC
100.0%	100.0% #617EC4	RGB 97 126 196	#617EC4

#C3CDF4 #B2BFEC #A2B2E4 #92A5DC #8198D4 #718BCC #617EC4

#C3CDF4 - #617EC4

HSV Blend

#C3CDF4 - #617EC4 | 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 #C3CDF4 as 0% and #617EC4 as 100%.

0.0%	0.0% #C3CDF4	RGB 195 205 244	#C3CDF4
16.7%	16.7% #B0BDEC	RGB 176 189 236	#B0BDEC
33.3%	33.3% #9FAFE4	RGB 159 175 228	#9FAFE4
50.0%	50.0% #8EA1DC	RGB 142 161 220	#8EA1DC
66.7%	66.7% #7E94D4	RGB 126 148 212	#7E94D4
83.3%	83.3% #6F89CC	RGB 111 137 204	#6F89CC
100.0%	100.0% #617EC4	RGB 97 126 196	#617EC4

#C3CDF4 #B0BDEC #9FAFE4 #8EA1DC #7E94D4 #6F89CC #617EC4

#C3CDF4 - #8EA1DC - #617EC4

CSS codes

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

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