#335391 - #C4CDDF | 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 #335391 to #C4CDDF

#335391 #C4CDDF

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

#335391 - #C4CDDF | 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 #335391 as 0% and #C4CDDF as 100%.

0.0%	0.0% #335391	RGB 51 83 145	#335391
16.7%	16.7% #4B679E	RGB 75 103 158	#4B679E
33.3%	33.3% #637BAB	RGB 99 123 171	#637BAB
50.0%	50.0% #7B90B8	RGB 123 144 184	#7B90B8
66.7%	66.7% #93A4C5	RGB 147 164 197	#93A4C5
83.3%	83.3% #ABB8D2	RGB 171 184 210	#ABB8D2
100.0%	100.0% #C4CDDF	RGB 196 205 223	#C4CDDF

#335391 #4B679E #637BAB #7B90B8 #93A4C5 #ABB8D2 #C4CDDF

#335391 - #C4CDDF

HSV Blend

#335391 - #C4CDDF | 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 #335391 as 0% and #C4CDDF as 100%.

0.0%	0.0% #335391	RGB 51 83 145	#335391
16.7%	16.7% #45639E	RGB 69 99 158	#45639E
33.3%	33.3% #5A75AB	RGB 90 117 171	#5A75AB
50.0%	50.0% #7189B8	RGB 113 137 184	#7189B8
66.7%	66.7% #8A9EC5	RGB 138 158 197	#8A9EC5
83.3%	83.3% #A6B4D2	RGB 166 180 210	#A6B4D2
100.0%	100.0% #C4CDDF	RGB 196 205 223	#C4CDDF

#335391 #45639E #5A75AB #7189B8 #8A9EC5 #A6B4D2 #C4CDDF

#335391 - #7189B8 - #C4CDDF

CSS codes

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

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