#3D5D9C - #C7D0E2 | 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 #3D5D9C to #C7D0E2

#3D5D9C #C7D0E2

Calculate the color between two colors, #3D5D9C and #C7D0E2. 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)

#3D5D9C - #C7D0E2 | 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 #3D5D9C as 0% and #C7D0E2 as 100%.

0.0%	0.0% #3D5D9C	RGB 61 93 156	#3D5D9C
16.7%	16.7% #5470A7	RGB 84 112 167	#5470A7
33.3%	33.3% #6B83B3	RGB 107 131 179	#6B83B3
50.0%	50.0% #8296BF	RGB 130 150 191	#8296BF
66.7%	66.7% #99A9CA	RGB 153 169 202	#99A9CA
83.3%	83.3% #B0BCD6	RGB 176 188 214	#B0BCD6
100.0%	100.0% #C7D0E2	RGB 199 208 226	#C7D0E2

#3D5D9C #5470A7 #6B83B3 #8296BF #99A9CA #B0BCD6 #C7D0E2

#3D5D9C - #C7D0E2

HSV Blend

#3D5D9C - #C7D0E2 | 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 #3D5D9C as 0% and #C7D0E2 as 100%.

0.0%	0.0% #3D5D9C	RGB 61 93 156	#3D5D9C
16.7%	16.7% #4F6CA7	RGB 79 108 167	#4F6CA7
33.3%	33.3% #637EB3	RGB 99 126 179	#637EB3
50.0%	50.0% #7990BF	RGB 121 144 191	#7990BF
66.7%	66.7% #91A4CA	RGB 145 164 202	#91A4CA
83.3%	83.3% #ABB9D6	RGB 171 185 214	#ABB9D6
100.0%	100.0% #C7D0E2	RGB 199 208 226	#C7D0E2

#3D5D9C #4F6CA7 #637EB3 #7990BF #91A4CA #ABB9D6 #C7D0E2

#3D5D9C - #7990BF - #C7D0E2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3D5D9C 0%, #7990BF 50%, #C7D0E2 100%);
    background: -webkit-linear-gradient(top, #3D5D9C 0%, #7990BF 50%, #C7D0E2 100%);
    background: linear-gradient(to bottom, #3D5D9C 0%, #7990BF 50%, #C7D0E2 100%);
}
</style>