#549289 - #928A54 | colorate

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

Blend #549289 to #928A54

#549289 #928A54

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

RGBブレンド

#549289 - #928A54 | colorate

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

0.0%	0.0% #549289	RGB 84 146 137	#549289
16.7%	16.7% #5E9080	RGB 94 144 128	#5E9080
33.3%	33.3% #688F77	RGB 104 143 119	#688F77
50.0%	50.0% #738E6E	RGB 115 142 110	#738E6E
66.7%	66.7% #7D8C65	RGB 125 140 101	#7D8C65
83.3%	83.3% #878B5C	RGB 135 139 92	#878B5C
100.0%	100.0% #928A54	RGB 146 138 84	#928A54

#549289 #5E9080 #688F77 #738E6E #7D8C65 #878B5C #928A54

#549289 - #928A54

HSVブレンド

#549289 - #928A54 | colorate

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

0.0%	0.0% #549289	RGB 84 146 137	#549289
16.7%	16.7% #549274	RGB 84 146 116	#549274
33.3%	33.3% #54925F	RGB 84 146 95	#54925F
50.0%	50.0% #5C9254	RGB 92 146 84	#5C9254
66.7%	66.7% #719254	RGB 113 146 84	#719254
83.3%	83.3% #859254	RGB 133 146 84	#859254
100.0%	100.0% #928A54	RGB 146 138 84	#928A54

#549289 #549274 #54925F #5C9254 #719254 #859254 #928A54

#549289 - #5C9254 - #928A54

CSSコード

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

/* HSV Gradation */
div {
    background: -moz-linear-gradient(top, #549289 0%, #5C9254 50%, #928A54 100%);
    background: -webkit-linear-gradient(top, #549289 0%, #5C9254 50%, #928A54 100%);
    background: linear-gradient(to bottom, #549289 0%, #5C9254 50%, #928A54 100%);
}
</style>