#5C8A8E - #3F5E74 | colorate

colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。サイトをよりよくする

Blend #5C8A8E to #3F5E74

#5C8A8Eと#3F5E74の二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。

RGBブレンド

#5C8A8E - #3F5E74 | colorate

RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#5C8A8Eを0%、#3F5E74を100%として二色間の色を展開します。

0.0%	0.0% #5C8A8E	RGB 92 138 142	#5C8A8E
16.7%	16.7% #578289	RGB 87 130 137	#578289
33.3%	33.3% #527B85	RGB 82 123 133	#527B85
50.0%	50.0% #4D7481	RGB 77 116 129	#4D7481
66.7%	66.7% #486C7C	RGB 72 108 124	#486C7C
83.3%	83.3% #436578	RGB 67 101 120	#436578
100.0%	100.0% #3F5E74	RGB 63 94 116	#3F5E74

#5C8A8E #578289 #527B85 #4D7481 #486C7C #436578 #3F5E74

#5C8A8E - #3F5E74

HSVブレンド

#5C8A8E - #3F5E74 | colorate

HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#5C8A8Eを0%、#3F5E74を100%として二色間の色を展開します。

0.0%	0.0% #5C8A8E	RGB 92 138 142	#5C8A8E
16.7%	16.7% #568289	RGB 86 130 137	#568289
33.3%	33.3% #517B85	RGB 81 123 133	#517B85
50.0%	50.0% #4C7481	RGB 76 116 129	#4C7481
66.7%	66.7% #486C7C	RGB 72 108 124	#486C7C
83.3%	83.3% #436578	RGB 67 101 120	#436578
100.0%	100.0% #3F5E74	RGB 63 94 116	#3F5E74

#5C8A8E #568289 #517B85 #4C7481 #486C7C #436578 #3F5E74

#5C8A8E - #4C7481 - #3F5E74

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5C8A8E 0%, #4C7481 50%, #3F5E74 100%);
    background: -webkit-linear-gradient(top, #5C8A8E 0%, #4C7481 50%, #3F5E74 100%);
    background: linear-gradient(to bottom, #5C8A8E 0%, #4C7481 50%, #3F5E74 100%);
}
</style>