#7FD2FF - #2486DB | 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 #7FD2FF to #2486DB

#7FD2FF #2486DB

Calculate the color between two colors, #7FD2FF and #2486DB. 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)

#7FD2FF - #2486DB | 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 #7FD2FF as 0% and #2486DB as 100%.

0.0%	0.0% #7FD2FF	RGB 127 210 255	#7FD2FF
16.7%	16.7% #6FC5F9	RGB 111 197 249	#6FC5F9
33.3%	33.3% #60B8F3	RGB 96 184 243	#60B8F3
50.0%	50.0% #51ACED	RGB 81 172 237	#51ACED
66.7%	66.7% #429FE7	RGB 66 159 231	#429FE7
83.3%	83.3% #3392E1	RGB 51 146 225	#3392E1
100.0%	100.0% #2486DB	RGB 36 134 219	#2486DB

#7FD2FF #6FC5F9 #60B8F3 #51ACED #429FE7 #3392E1 #2486DB

#7FD2FF - #2486DB

HSV Blend

#7FD2FF - #2486DB | 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 #7FD2FF as 0% and #2486DB as 100%.

0.0%	0.0% #7FD2FF	RGB 127 210 255	#7FD2FF
16.7%	16.7% #6EC5F9	RGB 110 197 249	#6EC5F9
33.3%	33.3% #5DB9F3	RGB 93 185 243	#5DB9F3
50.0%	50.0% #4EACED	RGB 78 172 237	#4EACED
66.7%	66.7% #3F9FE7	RGB 63 159 231	#3F9FE7
83.3%	83.3% #3192E1	RGB 49 146 225	#3192E1
100.0%	100.0% #2486DB	RGB 36 134 219	#2486DB

#7FD2FF #6EC5F9 #5DB9F3 #4EACED #3F9FE7 #3192E1 #2486DB

#7FD2FF - #4EACED - #2486DB

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #7FD2FF 0%, #4EACED 50%, #2486DB 100%);
    background: -webkit-linear-gradient(top, #7FD2FF 0%, #4EACED 50%, #2486DB 100%);
    background: linear-gradient(to bottom, #7FD2FF 0%, #4EACED 50%, #2486DB 100%);
}
</style>