#7A8BC2 - #D9DDED | 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 #7A8BC2 to #D9DDED

#7A8BC2 #D9DDED

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

#7A8BC2 - #D9DDED | 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 #7A8BC2 as 0% and #D9DDED as 100%.

0.0%	0.0% #7A8BC2	RGB 122 139 194	#7A8BC2
16.7%	16.7% #8998C9	RGB 137 152 201	#8998C9
33.3%	33.3% #99A6D0	RGB 153 166 208	#99A6D0
50.0%	50.0% #A9B4D7	RGB 169 180 215	#A9B4D7
66.7%	66.7% #B9C1DE	RGB 185 193 222	#B9C1DE
83.3%	83.3% #C9CFE5	RGB 201 207 229	#C9CFE5
100.0%	100.0% #D9DDED	RGB 217 221 237	#D9DDED

#7A8BC2 #8998C9 #99A6D0 #A9B4D7 #B9C1DE #C9CFE5 #D9DDED

#7A8BC2 - #D9DDED

HSV Blend

#7A8BC2 - #D9DDED | 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 #7A8BC2 as 0% and #D9DDED as 100%.

0.0%	0.0% #7A8BC2	RGB 122 139 194	#7A8BC2
16.7%	16.7% #8897C9	RGB 136 151 201	#8897C9
33.3%	33.3% #96A3D0	RGB 150 163 208	#96A3D0
50.0%	50.0% #A6B1D7	RGB 166 177 215	#A6B1D7
66.7%	66.7% #B6BFDE	RGB 182 191 222	#B6BFDE
83.3%	83.3% #C7CDE5	RGB 199 205 229	#C7CDE5
100.0%	100.0% #D9DDED	RGB 217 221 237	#D9DDED

#7A8BC2 #8897C9 #96A3D0 #A6B1D7 #B6BFDE #C7CDE5 #D9DDED

#7A8BC2 - #A6B1D7 - #D9DDED

CSS codes

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

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