#7AA1BC - #1F5087 | 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 #7AA1BC to #1F5087

#7AA1BC #1F5087

Calculate the color between two colors, #7AA1BC and #1F5087. 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)

#7AA1BC - #1F5087 | 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 #7AA1BC as 0% and #1F5087 as 100%.

0.0%	0.0% #7AA1BC	RGB 122 161 188	#7AA1BC
16.7%	16.7% #6A93B3	RGB 106 147 179	#6A93B3
33.3%	33.3% #5B86AA	RGB 91 134 170	#5B86AA
50.0%	50.0% #4C78A1	RGB 76 120 161	#4C78A1
66.7%	66.7% #3D6B98	RGB 61 107 152	#3D6B98
83.3%	83.3% #2E5D8F	RGB 46 93 143	#2E5D8F
100.0%	100.0% #1F5087	RGB 31 80 135	#1F5087

#7AA1BC #6A93B3 #5B86AA #4C78A1 #3D6B98 #2E5D8F #1F5087

#7AA1BC - #1F5087

HSV Blend

#7AA1BC - #1F5087 | 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 #7AA1BC as 0% and #1F5087 as 100%.

0.0%	0.0% #7AA1BC	RGB 122 161 188	#7AA1BC
16.7%	16.7% #6792B3	RGB 103 146 179	#6792B3
33.3%	33.3% #5684AA	RGB 86 132 170	#5684AA
50.0%	50.0% #4677A1	RGB 70 119 161	#4677A1
66.7%	66.7% #386998	RGB 56 105 152	#386998
83.3%	83.3% #2B5C8F	RGB 43 92 143	#2B5C8F
100.0%	100.0% #1F5087	RGB 31 80 135	#1F5087

#7AA1BC #6792B3 #5684AA #4677A1 #386998 #2B5C8F #1F5087

#7AA1BC - #4677A1 - #1F5087

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #7AA1BC 0%, #4677A1 50%, #1F5087 100%);
    background: -webkit-linear-gradient(top, #7AA1BC 0%, #4677A1 50%, #1F5087 100%);
    background: linear-gradient(to bottom, #7AA1BC 0%, #4677A1 50%, #1F5087 100%);
}
</style>