#7DF0FF - #234448 | 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 #7DF0FF to #234448

#7DF0FF #234448

Calculate the color between two colors, #7DF0FF and #234448. 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)

#7DF0FF - #234448 | 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 #7DF0FF as 0% and #234448 as 100%.

0.0%	0.0% #7DF0FF	RGB 125 240 255	#7DF0FF
16.7%	16.7% #6ED3E0	RGB 110 211 224	#6ED3E0
33.3%	33.3% #5FB6C2	RGB 95 182 194	#5FB6C2
50.0%	50.0% #509AA3	RGB 80 154 163	#509AA3
66.7%	66.7% #417D84	RGB 65 125 132	#417D84
83.3%	83.3% #326066	RGB 50 96 102	#326066
100.0%	100.0% #234448	RGB 35 68 72	#234448

#7DF0FF #6ED3E0 #5FB6C2 #509AA3 #417D84 #326066 #234448

#7DF0FF - #234448

HSV Blend

#7DF0FF - #234448 | 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 #7DF0FF as 0% and #234448 as 100%.

0.0%	0.0% #7DF0FF	RGB 125 240 255	#7DF0FF
16.7%	16.7% #6DD3E0	RGB 109 211 224	#6DD3E0
33.3%	33.3% #5EB6C2	RGB 94 182 194	#5EB6C2
50.0%	50.0% #4F9AA3	RGB 79 154 163	#4F9AA3
66.7%	66.7% #407D84	RGB 64 125 132	#407D84
83.3%	83.3% #316066	RGB 49 96 102	#316066
100.0%	100.0% #234448	RGB 35 68 72	#234448

#7DF0FF #6DD3E0 #5EB6C2 #4F9AA3 #407D84 #316066 #234448

#7DF0FF - #4F9AA3 - #234448

CSS codes

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

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