#12B5E2 - #B1F2DE | 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 #12B5E2 to #B1F2DE

#12B5E2 #B1F2DE

Calculate the color between two colors, #12B5E2 and #B1F2DE. 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)

#12B5E2 - #B1F2DE | 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 #12B5E2 as 0% and #B1F2DE as 100%.

0.0%	0.0% #12B5E2	RGB 18 181 226	#12B5E2
16.7%	16.7% #2CBFE1	RGB 44 191 225	#2CBFE1
33.3%	33.3% #47C9E0	RGB 71 201 224	#47C9E0
50.0%	50.0% #61D3E0	RGB 97 211 224	#61D3E0
66.7%	66.7% #7CDDDF	RGB 124 221 223	#7CDDDF
83.3%	83.3% #96E7DE	RGB 150 231 222	#96E7DE
100.0%	100.0% #B1F2DE	RGB 177 242 222	#B1F2DE

#12B5E2 #2CBFE1 #47C9E0 #61D3E0 #7CDDDF #96E7DE #B1F2DE

#12B5E2 - #B1F2DE

HSV Blend

#12B5E2 - #B1F2DE | 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 #12B5E2 as 0% and #B1F2DE as 100%.

0.0%	0.0% #11B4E2	RGB 17 180 226	#11B4E2
16.7%	16.7% #2BCCE4	RGB 43 204 228	#2BCCE4
33.3%	33.3% #44E0E7	RGB 68 224 231	#44E0E7
50.0%	50.0% #5EEAE3	RGB 94 234 227	#5EEAE3
66.7%	66.7% #79ECDD	RGB 121 236 221	#79ECDD
83.3%	83.3% #95EFDB	RGB 149 239 219	#95EFDB
100.0%	100.0% #B1F2DE	RGB 177 242 222	#B1F2DE

#11B4E2 #2BCCE4 #44E0E7 #5EEAE3 #79ECDD #95EFDB #B1F2DE

#12B5E2 - #5EEAE3 - #B1F2DE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #11B4E2 0%, #5EEAE3 50%, #B1F2DE 100%);
    background: -webkit-linear-gradient(top, #11B4E2 0%, #5EEAE3 50%, #B1F2DE 100%);
    background: linear-gradient(to bottom, #11B4E2 0%, #5EEAE3 50%, #B1F2DE 100%);
}
</style>