#5166A0 - #CDD3E3 | 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 #5166A0 to #CDD3E3

#5166A0 #CDD3E3

Calculate the color between two colors, #5166A0 and #CDD3E3. 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)

#5166A0 - #CDD3E3 | 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 #5166A0 as 0% and #CDD3E3 as 100%.

0.0%	0.0% #5166A0	RGB 81 102 160	#5166A0
16.7%	16.7% #6578AB	RGB 101 120 171	#6578AB
33.3%	33.3% #7A8AB6	RGB 122 138 182	#7A8AB6
50.0%	50.0% #8F9CC1	RGB 143 156 193	#8F9CC1
66.7%	66.7% #A3AECC	RGB 163 174 204	#A3AECC
83.3%	83.3% #B8C0D7	RGB 184 192 215	#B8C0D7
100.0%	100.0% #CDD3E3	RGB 205 211 227	#CDD3E3

#5166A0 #6578AB #7A8AB6 #8F9CC1 #A3AECC #B8C0D7 #CDD3E3

#5166A0 - #CDD3E3

HSV Blend

#5166A0 - #CDD3E3 | 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 #5166A0 as 0% and #CDD3E3 as 100%.

0.0%	0.0% #5166A0	RGB 81 102 160	#5166A0
16.7%	16.7% #6175AB	RGB 97 117 171	#6175AB
33.3%	33.3% #7486B6	RGB 116 134 182	#7486B6
50.0%	50.0% #8897C1	RGB 136 151 193	#8897C1
66.7%	66.7% #9DAACC	RGB 157 170 204	#9DAACC
83.3%	83.3% #B4BED7	RGB 180 190 215	#B4BED7
100.0%	100.0% #CDD3E3	RGB 205 211 227	#CDD3E3

#5166A0 #6175AB #7486B6 #8897C1 #9DAACC #B4BED7 #CDD3E3

#5166A0 - #8897C1 - #CDD3E3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5166A0 0%, #8897C1 50%, #CDD3E3 100%);
    background: -webkit-linear-gradient(top, #5166A0 0%, #8897C1 50%, #CDD3E3 100%);
    background: linear-gradient(to bottom, #5166A0 0%, #8897C1 50%, #CDD3E3 100%);
}
</style>