#50667A - #CDD4D9 | 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 #50667A to #CDD4D9

#50667A #CDD4D9

Calculate the color between two colors, #50667A and #CDD4D9. 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)

#50667A - #CDD4D9 | 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 #50667A as 0% and #CDD4D9 as 100%.

0.0%	0.0% #50667A	RGB 80 102 122	#50667A
16.7%	16.7% #647889	RGB 100 120 137	#647889
33.3%	33.3% #798A99	RGB 121 138 153	#798A99
50.0%	50.0% #8E9DA9	RGB 142 157 169	#8E9DA9
66.7%	66.7% #A3AFB9	RGB 163 175 185	#A3AFB9
83.3%	83.3% #B8C1C9	RGB 184 193 201	#B8C1C9
100.0%	100.0% #CDD4D9	RGB 205 212 217	#CDD4D9

#50667A #647889 #798A99 #8E9DA9 #A3AFB9 #B8C1C9 #CDD4D9

#50667A - #CDD4D9

HSV Blend

#50667A - #CDD4D9 | 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 #50667A as 0% and #CDD4D9 as 100%.

0.0%	0.0% #50667A	RGB 80 102 122	#50667A
16.7%	16.7% #617689	RGB 97 118 137	#617689
33.3%	33.3% #738899	RGB 115 136 153	#738899
50.0%	50.0% #879AA9	RGB 135 154 169	#879AA9
66.7%	66.7% #9DADB9	RGB 157 173 185	#9DADB9
83.3%	83.3% #B4C0C9	RGB 180 192 201	#B4C0C9
100.0%	100.0% #CDD4D9	RGB 205 212 217	#CDD4D9

#50667A #617689 #738899 #879AA9 #9DADB9 #B4C0C9 #CDD4D9

#50667A - #879AA9 - #CDD4D9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #50667A 0%, #879AA9 50%, #CDD4D9 100%);
    background: -webkit-linear-gradient(top, #50667A 0%, #879AA9 50%, #CDD4D9 100%);
    background: linear-gradient(to bottom, #50667A 0%, #879AA9 50%, #CDD4D9 100%);
}
</style>