#97A5E6 - #ECEBDF | 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 #97A5E6 to #ECEBDF

#97A5E6 #ECEBDF

Calculate the color between two colors, #97A5E6 and #ECEBDF. 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)

#97A5E6 - #ECEBDF | 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 #97A5E6 as 0% and #ECEBDF as 100%.

0.0%	0.0% #97A5E6	RGB 151 165 230	#97A5E6
16.7%	16.7% #A5B0E4	RGB 165 176 228	#A5B0E4
33.3%	33.3% #B3BCE3	RGB 179 188 227	#B3BCE3
50.0%	50.0% #C1C8E2	RGB 193 200 226	#C1C8E2
66.7%	66.7% #CFD3E1	RGB 207 211 225	#CFD3E1
83.3%	83.3% #DDDFE0	RGB 221 223 224	#DDDFE0
100.0%	100.0% #ECEBDF	RGB 236 235 223	#ECEBDF

#97A5E6 #A5B0E4 #B3BCE3 #C1C8E2 #CFD3E1 #DDDFE0 #ECEBDF

#97A5E6 - #ECEBDF

HSV Blend

#97A5E6 - #ECEBDF | 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 #97A5E6 as 0% and #ECEBDF as 100%.

0.0%	0.0% #97A5E6	RGB 151 165 230	#97A5E6
16.7%	16.7% #A2CFE7	RGB 162 207 231	#A2CFE7
33.3%	33.3% #AEE8DF	RGB 174 232 223	#AEE8DF
50.0%	50.0% #BAE9CB	RGB 186 233 203	#BAE9CB
66.7%	66.7% #CAEAC6	RGB 202 234 198	#CAEAC6
83.3%	83.3% #E1EBD2	RGB 225 235 210	#E1EBD2
100.0%	100.0% #ECEBDF	RGB 236 235 223	#ECEBDF

#97A5E6 #A2CFE7 #AEE8DF #BAE9CB #CAEAC6 #E1EBD2 #ECEBDF

#97A5E6 - #BAE9CB - #ECEBDF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #97A5E6 0%, #BAE9CB 50%, #ECEBDF 100%);
    background: -webkit-linear-gradient(top, #97A5E6 0%, #BAE9CB 50%, #ECEBDF 100%);
    background: linear-gradient(to bottom, #97A5E6 0%, #BAE9CB 50%, #ECEBDF 100%);
}
</style>