#7A8F9C - #D9DFE2 | 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 #7A8F9C to #D9DFE2

#7A8F9C #D9DFE2

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

#7A8F9C - #D9DFE2 | 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 #7A8F9C as 0% and #D9DFE2 as 100%.

0.0%	0.0% #7A8F9C	RGB 122 143 156	#7A8F9C
16.7%	16.7% #899CA7	RGB 137 156 167	#899CA7
33.3%	33.3% #99A9B3	RGB 153 169 179	#99A9B3
50.0%	50.0% #A9B7BF	RGB 169 183 191	#A9B7BF
66.7%	66.7% #B9C4CA	RGB 185 196 202	#B9C4CA
83.3%	83.3% #C9D1D6	RGB 201 209 214	#C9D1D6
100.0%	100.0% #D9DFE2	RGB 217 223 226	#D9DFE2

#7A8F9C #899CA7 #99A9B3 #A9B7BF #B9C4CA #C9D1D6 #D9DFE2

#7A8F9C - #D9DFE2

HSV Blend

#7A8F9C - #D9DFE2 | 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 #7A8F9C as 0% and #D9DFE2 as 100%.

0.0%	0.0% #7A8F9C	RGB 122 143 156	#7A8F9C
16.7%	16.7% #889BA7	RGB 136 155 167	#889BA7
33.3%	33.3% #96A8B3	RGB 150 168 179	#96A8B3
50.0%	50.0% #A6B6BF	RGB 166 182 191	#A6B6BF
66.7%	66.7% #B6C3CA	RGB 182 195 202	#B6C3CA
83.3%	83.3% #C7D1D6	RGB 199 209 214	#C7D1D6
100.0%	100.0% #D9DFE2	RGB 217 223 226	#D9DFE2

#7A8F9C #889BA7 #96A8B3 #A6B6BF #B6C3CA #C7D1D6 #D9DFE2

#7A8F9C - #A6B6BF - #D9DFE2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #7A8F9C 0%, #A6B6BF 50%, #D9DFE2 100%);
    background: -webkit-linear-gradient(top, #7A8F9C 0%, #A6B6BF 50%, #D9DFE2 100%);
    background: linear-gradient(to bottom, #7A8F9C 0%, #A6B6BF 50%, #D9DFE2 100%);
}
</style>