#4B8CFF - #8CCDFD | 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 #4B8CFF to #8CCDFD

#4B8CFF #8CCDFD

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

#4B8CFF - #8CCDFD | 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 #4B8CFF as 0% and #8CCDFD as 100%.

0.0%	0.0% #4B8CFF	RGB 75 140 255	#4B8CFF
16.7%	16.7% #5596FE	RGB 85 150 254	#5596FE
33.3%	33.3% #60A1FE	RGB 96 161 254	#60A1FE
50.0%	50.0% #6BACFE	RGB 107 172 254	#6BACFE
66.7%	66.7% #76B7FD	RGB 118 183 253	#76B7FD
83.3%	83.3% #81C2FD	RGB 129 194 253	#81C2FD
100.0%	100.0% #8CCDFD	RGB 140 205 253	#8CCDFD

#4B8CFF #5596FE #60A1FE #6BACFE #76B7FD #81C2FD #8CCDFD

#4B8CFF - #8CCDFD

HSV Blend

#4B8CFF - #8CCDFD | 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 #4B8CFF as 0% and #8CCDFD as 100%.

0.0%	0.0% #4B8BFF	RGB 75 139 255	#4B8BFF
16.7%	16.7% #5598FE	RGB 85 152 254	#5598FE
33.3%	33.3% #60A4FE	RGB 96 164 254	#60A4FE
50.0%	50.0% #6BB0FE	RGB 107 176 254	#6BB0FE
66.7%	66.7% #76BAFD	RGB 118 186 253	#76BAFD
83.3%	83.3% #81C4FD	RGB 129 196 253	#81C4FD
100.0%	100.0% #8CCDFD	RGB 140 205 253	#8CCDFD

#4B8BFF #5598FE #60A4FE #6BB0FE #76BAFD #81C4FD #8CCDFD

#4B8CFF - #6BB0FE - #8CCDFD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4B8BFF 0%, #6BB0FE 50%, #8CCDFD 100%);
    background: -webkit-linear-gradient(top, #4B8BFF 0%, #6BB0FE 50%, #8CCDFD 100%);
    background: linear-gradient(to bottom, #4B8BFF 0%, #6BB0FE 50%, #8CCDFD 100%);
}
</style>