#2D526C - #688D9C | 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 #2D526C to #688D9C

#2D526C #688D9C

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

#2D526C - #688D9C | 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 #2D526C as 0% and #688D9C as 100%.

0.0%	0.0% #2D526C	RGB 45 82 108	#2D526C
16.7%	16.7% #365B74	RGB 54 91 116	#365B74
33.3%	33.3% #40657C	RGB 64 101 124	#40657C
50.0%	50.0% #4A6F84	RGB 74 111 132	#4A6F84
66.7%	66.7% #54798C	RGB 84 121 140	#54798C
83.3%	83.3% #5E8394	RGB 94 131 148	#5E8394
100.0%	100.0% #688D9C	RGB 104 141 156	#688D9C

#2D526C #365B74 #40657C #4A6F84 #54798C #5E8394 #688D9C

#2D526C - #688D9C

HSV Blend

#2D526C - #688D9C | 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 #2D526C as 0% and #688D9C as 100%.

0.0%	0.0% #2D516C	RGB 45 81 108	#2D516C
16.7%	16.7% #355B74	RGB 53 91 116	#355B74
33.3%	33.3% #3E647C	RGB 62 100 124	#3E647C
50.0%	50.0% #476E84	RGB 71 110 132	#476E84
66.7%	66.7% #51788C	RGB 81 120 140	#51788C
83.3%	83.3% #5C8294	RGB 92 130 148	#5C8294
100.0%	100.0% #688D9C	RGB 104 141 156	#688D9C

#2D516C #355B74 #3E647C #476E84 #51788C #5C8294 #688D9C

#2D526C - #476E84 - #688D9C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2D516C 0%, #476E84 50%, #688D9C 100%);
    background: -webkit-linear-gradient(top, #2D516C 0%, #476E84 50%, #688D9C 100%);
    background: linear-gradient(to bottom, #2D516C 0%, #476E84 50%, #688D9C 100%);
}
</style>