#97D5E6 - #428BB4 | 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 #97D5E6 to #428BB4

#97D5E6 #428BB4

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

#97D5E6 - #428BB4 | 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 #97D5E6 as 0% and #428BB4 as 100%.

0.0%	0.0% #97D5E6	RGB 151 213 230	#97D5E6
16.7%	16.7% #88C8DD	RGB 136 200 221	#88C8DD
33.3%	33.3% #7ABCD5	RGB 122 188 213	#7ABCD5
50.0%	50.0% #6CB0CD	RGB 108 176 205	#6CB0CD
66.7%	66.7% #5EA3C4	RGB 94 163 196	#5EA3C4
83.3%	83.3% #5097BC	RGB 80 151 188	#5097BC
100.0%	100.0% #428BB4	RGB 66 139 180	#428BB4

#97D5E6 #88C8DD #7ABCD5 #6CB0CD #5EA3C4 #5097BC #428BB4

#97D5E6 - #428BB4

HSV Blend

#97D5E6 - #428BB4 | 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 #97D5E6 as 0% and #428BB4 as 100%.

0.0%	0.0% #97D5E6	RGB 151 213 230	#97D5E6
16.7%	16.7% #86C8DD	RGB 134 200 221	#86C8DD
33.3%	33.3% #77BCD5	RGB 119 188 213	#77BCD5
50.0%	50.0% #68B0CD	RGB 104 176 205	#68B0CD
66.7%	66.7% #5BA3C4	RGB 91 163 196	#5BA3C4
83.3%	83.3% #4E97BC	RGB 78 151 188	#4E97BC
100.0%	100.0% #428BB4	RGB 66 139 180	#428BB4

#97D5E6 #86C8DD #77BCD5 #68B0CD #5BA3C4 #4E97BC #428BB4

#97D5E6 - #68B0CD - #428BB4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #97D5E6 0%, #68B0CD 50%, #428BB4 100%);
    background: -webkit-linear-gradient(top, #97D5E6 0%, #68B0CD 50%, #428BB4 100%);
    background: linear-gradient(to bottom, #97D5E6 0%, #68B0CD 50%, #428BB4 100%);
}
</style>