#2D4D5D - #C3CCD0 | 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 #2D4D5D to #C3CCD0

#2D4D5D #C3CCD0

Calculate the color between two colors, #2D4D5D and #C3CCD0. 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)

#2D4D5D - #C3CCD0 | 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 #2D4D5D as 0% and #C3CCD0 as 100%.

0.0%	0.0% #2D4D5D	RGB 45 77 93	#2D4D5D
16.7%	16.7% #466270	RGB 70 98 112	#466270
33.3%	33.3% #5F7783	RGB 95 119 131	#5F7783
50.0%	50.0% #788C96	RGB 120 140 150	#788C96
66.7%	66.7% #91A1A9	RGB 145 161 169	#91A1A9
83.3%	83.3% #AAB6BC	RGB 170 182 188	#AAB6BC
100.0%	100.0% #C3CCD0	RGB 195 204 208	#C3CCD0

#2D4D5D #466270 #5F7783 #788C96 #91A1A9 #AAB6BC #C3CCD0

#2D4D5D - #C3CCD0

HSV Blend

#2D4D5D - #C3CCD0 | 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 #2D4D5D as 0% and #C3CCD0 as 100%.

0.0%	0.0% #2D4D5D	RGB 45 77 93	#2D4D5D
16.7%	16.7% #3E5F70	RGB 62 95 112	#3E5F70
33.3%	33.3% #537383	RGB 83 115 131	#537383
50.0%	50.0% #6A8896	RGB 106 136 150	#6A8896
66.7%	66.7% #859EA9	RGB 133 158 169	#859EA9
83.3%	83.3% #A2B4BC	RGB 162 180 188	#A2B4BC
100.0%	100.0% #C3CCD0	RGB 195 204 208	#C3CCD0

#2D4D5D #3E5F70 #537383 #6A8896 #859EA9 #A2B4BC #C3CCD0

#2D4D5D - #6A8896 - #C3CCD0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2D4D5D 0%, #6A8896 50%, #C3CCD0 100%);
    background: -webkit-linear-gradient(top, #2D4D5D 0%, #6A8896 50%, #C3CCD0 100%);
    background: linear-gradient(to bottom, #2D4D5D 0%, #6A8896 50%, #C3CCD0 100%);
}
</style>