#2DBADB - #ABEDFF | 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 #2DBADB to #ABEDFF

#2DBADB #ABEDFF

Calculate the color between two colors, #2DBADB and #ABEDFF. 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)

#2DBADB - #ABEDFF | 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 #2DBADB as 0% and #ABEDFF as 100%.

0.0%	0.0% #2DBADB	RGB 45 186 219	#2DBADB
16.7%	16.7% #42C2E1	RGB 66 194 225	#42C2E1
33.3%	33.3% #57CBE7	RGB 87 203 231	#57CBE7
50.0%	50.0% #6CD3ED	RGB 108 211 237	#6CD3ED
66.7%	66.7% #81DCF3	RGB 129 220 243	#81DCF3
83.3%	83.3% #96E4F9	RGB 150 228 249	#96E4F9
100.0%	100.0% #ABEDFF	RGB 171 237 255	#ABEDFF

#2DBADB #42C2E1 #57CBE7 #6CD3ED #81DCF3 #96E4F9 #ABEDFF

#2DBADB - #ABEDFF

HSV Blend

#2DBADB - #ABEDFF | 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 #2DBADB as 0% and #ABEDFF as 100%.

0.0%	0.0% #2DBADB	RGB 45 186 219	#2DBADB
16.7%	16.7% #3FC1E1	RGB 63 193 225	#3FC1E1
33.3%	33.3% #53C9E7	RGB 83 201 231	#53C9E7
50.0%	50.0% #67D2ED	RGB 103 210 237	#67D2ED
66.7%	66.7% #7DDAF3	RGB 125 218 243	#7DDAF3
83.3%	83.3% #93E3F9	RGB 147 227 249	#93E3F9
100.0%	100.0% #ABEDFF	RGB 171 237 255	#ABEDFF

#2DBADB #3FC1E1 #53C9E7 #67D2ED #7DDAF3 #93E3F9 #ABEDFF

#2DBADB - #67D2ED - #ABEDFF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2DBADB 0%, #67D2ED 50%, #ABEDFF 100%);
    background: -webkit-linear-gradient(top, #2DBADB 0%, #67D2ED 50%, #ABEDFF 100%);
    background: linear-gradient(to bottom, #2DBADB 0%, #67D2ED 50%, #ABEDFF 100%);
}
</style>