#7BB5E8 - #CEDBE1 | 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 #7BB5E8 to #CEDBE1

#7BB5E8 #CEDBE1

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

#7BB5E8 - #CEDBE1 | 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 #7BB5E8 as 0% and #CEDBE1 as 100%.

0.0%	0.0% #7BB5E8	RGB 123 181 232	#7BB5E8
16.7%	16.7% #88BBE6	RGB 136 187 230	#88BBE6
33.3%	33.3% #96C1E5	RGB 150 193 229	#96C1E5
50.0%	50.0% #A4C8E4	RGB 164 200 228	#A4C8E4
66.7%	66.7% #B2CEE3	RGB 178 206 227	#B2CEE3
83.3%	83.3% #C0D4E2	RGB 192 212 226	#C0D4E2
100.0%	100.0% #CEDBE1	RGB 206 219 225	#CEDBE1

#7BB5E8 #88BBE6 #96C1E5 #A4C8E4 #B2CEE3 #C0D4E2 #CEDBE1

#7BB5E8 - #CEDBE1

HSV Blend

#7BB5E8 - #CEDBE1 | 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 #7BB5E8 as 0% and #CEDBE1 as 100%.

0.0%	0.0% #7BB5E8	RGB 123 181 232	#7BB5E8
16.7%	16.7% #89BDE6	RGB 137 189 230	#89BDE6
33.3%	33.3% #97C4E5	RGB 151 196 229	#97C4E5
50.0%	50.0% #A5CBE4	RGB 165 203 228	#A5CBE4
66.7%	66.7% #B2D1E3	RGB 178 209 227	#B2D1E3
83.3%	83.3% #C0D6E2	RGB 192 214 226	#C0D6E2
100.0%	100.0% #CEDBE1	RGB 206 219 225	#CEDBE1

#7BB5E8 #89BDE6 #97C4E5 #A5CBE4 #B2D1E3 #C0D6E2 #CEDBE1

#7BB5E8 - #A5CBE4 - #CEDBE1

CSS codes

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

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