#4088A8 - #C8DDE6 | 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 #4088A8 to #C8DDE6

#4088A8 #C8DDE6

Calculate the color between two colors, #4088A8 and #C8DDE6. 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)

#4088A8 - #C8DDE6 | 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 #4088A8 as 0% and #C8DDE6 as 100%.

0.0%	0.0% #4088A8	RGB 64 136 168	#4088A8
16.7%	16.7% #5696B2	RGB 86 150 178	#5696B2
33.3%	33.3% #6DA4BC	RGB 109 164 188	#6DA4BC
50.0%	50.0% #84B2C7	RGB 132 178 199	#84B2C7
66.7%	66.7% #9AC0D1	RGB 154 192 209	#9AC0D1
83.3%	83.3% #B1CEDB	RGB 177 206 219	#B1CEDB
100.0%	100.0% #C8DDE6	RGB 200 221 230	#C8DDE6

#4088A8 #5696B2 #6DA4BC #84B2C7 #9AC0D1 #B1CEDB #C8DDE6

#4088A8 - #C8DDE6

HSV Blend

#4088A8 - #C8DDE6 | 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 #4088A8 as 0% and #C8DDE6 as 100%.

0.0%	0.0% #4088A8	RGB 64 136 168	#4088A8
16.7%	16.7% #5294B2	RGB 82 148 178	#5294B2
33.3%	33.3% #66A2BC	RGB 102 162 188	#66A2BC
50.0%	50.0% #7CB0C7	RGB 124 176 199	#7CB0C7
66.7%	66.7% #93BED1	RGB 147 190 209	#93BED1
83.3%	83.3% #ADCDDB	RGB 173 205 219	#ADCDDB
100.0%	100.0% #C8DDE6	RGB 200 221 230	#C8DDE6

#4088A8 #5294B2 #66A2BC #7CB0C7 #93BED1 #ADCDDB #C8DDE6

#4088A8 - #7CB0C7 - #C8DDE6

CSS codes

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

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