#84EBFF - #DDF2FD | 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 #84EBFF to #DDF2FD

#84EBFF #DDF2FD

Calculate the color between two colors, #84EBFF and #DDF2FD. 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)

#84EBFF - #DDF2FD | 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 #84EBFF as 0% and #DDF2FD as 100%.

0.0%	0.0% #84EBFF	RGB 132 235 255	#84EBFF
16.7%	16.7% #92ECFE	RGB 146 236 254	#92ECFE
33.3%	33.3% #A1EDFE	RGB 161 237 254	#A1EDFE
50.0%	50.0% #B0EEFE	RGB 176 238 254	#B0EEFE
66.7%	66.7% #BFEFFD	RGB 191 239 253	#BFEFFD
83.3%	83.3% #CEF0FD	RGB 206 240 253	#CEF0FD
100.0%	100.0% #DDF2FD	RGB 221 242 253	#DDF2FD

#84EBFF #92ECFE #A1EDFE #B0EEFE #BFEFFD #CEF0FD #DDF2FD

#84EBFF - #DDF2FD

HSV Blend

#84EBFF - #DDF2FD | 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 #84EBFF as 0% and #DDF2FD as 100%.

0.0%	0.0% #84EBFF	RGB 132 235 255	#84EBFF
16.7%	16.7% #92E9FE	RGB 146 233 254	#92E9FE
33.3%	33.3% #A1E9FE	RGB 161 233 254	#A1E9FE
50.0%	50.0% #B0EAFE	RGB 176 234 254	#B0EAFE
66.7%	66.7% #BFECFD	RGB 191 236 253	#BFECFD
83.3%	83.3% #CEEEFD	RGB 206 238 253	#CEEEFD
100.0%	100.0% #DDF2FD	RGB 221 242 253	#DDF2FD

#84EBFF #92E9FE #A1E9FE #B0EAFE #BFECFD #CEEEFD #DDF2FD

#84EBFF - #B0EAFE - #DDF2FD

CSS codes

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

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