#536465 - #CDD2D3 | 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 #536465 to #CDD2D3

#536465 #CDD2D3

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

#536465 - #CDD2D3 | 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 #536465 as 0% and #CDD2D3 as 100%.

0.0%	0.0% #536465	RGB 83 100 101	#536465
16.7%	16.7% #677677	RGB 103 118 119	#677677
33.3%	33.3% #7B8889	RGB 123 136 137	#7B8889
50.0%	50.0% #909B9C	RGB 144 155 156	#909B9C
66.7%	66.7% #A4ADAE	RGB 164 173 174	#A4ADAE
83.3%	83.3% #B8BFC0	RGB 184 191 192	#B8BFC0
100.0%	100.0% #CDD2D3	RGB 205 210 211	#CDD2D3

#536465 #677677 #7B8889 #909B9C #A4ADAE #B8BFC0 #CDD2D3

#536465 - #CDD2D3

HSV Blend

#536465 - #CDD2D3 | 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 #536465 as 0% and #CDD2D3 as 100%.

0.0%	0.0% #536465	RGB 83 100 101	#536465
16.7%	16.7% #657577	RGB 101 117 119	#657577
33.3%	33.3% #788889	RGB 120 136 137	#788889
50.0%	50.0% #8B9A9C	RGB 139 154 156	#8B9A9C
66.7%	66.7% #A0ACAE	RGB 160 172 174	#A0ACAE
83.3%	83.3% #B6BFC0	RGB 182 191 192	#B6BFC0
100.0%	100.0% #CDD2D3	RGB 205 210 211	#CDD2D3

#536465 #657577 #788889 #8B9A9C #A0ACAE #B6BFC0 #CDD2D3

#536465 - #8B9A9C - #CDD2D3

CSS codes

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

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