#4DA2D4 - #BED9DA | 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 #4DA2D4 to #BED9DA

#4DA2D4 #BED9DA

Calculate the color between two colors, #4DA2D4 and #BED9DA. 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)

#4DA2D4 - #BED9DA | 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 #4DA2D4 as 0% and #BED9DA as 100%.

0.0%	0.0% #4DA2D4	RGB 77 162 212	#4DA2D4
16.7%	16.7% #5FABD5	RGB 95 171 213	#5FABD5
33.3%	33.3% #72B4D6	RGB 114 180 214	#72B4D6
50.0%	50.0% #85BDD7	RGB 133 189 215	#85BDD7
66.7%	66.7% #98C6D8	RGB 152 198 216	#98C6D8
83.3%	83.3% #ABCFD9	RGB 171 207 217	#ABCFD9
100.0%	100.0% #BED9DA	RGB 190 217 218	#BED9DA

#4DA2D4 #5FABD5 #72B4D6 #85BDD7 #98C6D8 #ABCFD9 #BED9DA

#4DA2D4 - #BED9DA

HSV Blend

#4DA2D4 - #BED9DA | 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 #4DA2D4 as 0% and #BED9DA as 100%.

0.0%	0.0% #4DA1D4	RGB 77 161 212	#4DA1D4
16.7%	16.7% #5FB0D5	RGB 95 176 213	#5FB0D5
33.3%	33.3% #71BCD6	RGB 113 188 214	#71BCD6
50.0%	50.0% #84C6D7	RGB 132 198 215	#84C6D7
66.7%	66.7% #97CED8	RGB 151 206 216	#97CED8
83.3%	83.3% #AAD4D9	RGB 170 212 217	#AAD4D9
100.0%	100.0% #BED9DA	RGB 190 217 218	#BED9DA

#4DA1D4 #5FB0D5 #71BCD6 #84C6D7 #97CED8 #AAD4D9 #BED9DA

#4DA2D4 - #84C6D7 - #BED9DA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4DA1D4 0%, #84C6D7 50%, #BED9DA 100%);
    background: -webkit-linear-gradient(top, #4DA1D4 0%, #84C6D7 50%, #BED9DA 100%);
    background: linear-gradient(to bottom, #4DA1D4 0%, #84C6D7 50%, #BED9DA 100%);
}
</style>