#78877C - #BEC490 | colorate

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

Blend #78877C to #BEC490

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

RGBブレンド

#78877C - #BEC490 | colorate

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

0.0%	0.0% #78877C	RGB 120 135 124	#78877C
16.7%	16.7% #83917F	RGB 131 145 127	#83917F
33.3%	33.3% #8F9B82	RGB 143 155 130	#8F9B82
50.0%	50.0% #9BA586	RGB 155 165 134	#9BA586
66.7%	66.7% #A6AF89	RGB 166 175 137	#A6AF89
83.3%	83.3% #B2B98C	RGB 178 185 140	#B2B98C
100.0%	100.0% #BEC490	RGB 190 196 144	#BEC490

#78877C #83917F #8F9B82 #9BA586 #A6AF89 #B2B98C #BEC490

#78877C - #BEC490

HSVブレンド

#78877C - #BEC490 | colorate

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

0.0%	0.0% #78877C	RGB 120 135 124	#78877C
16.7%	16.7% #7D917E	RGB 125 145 126	#7D917E
33.3%	33.3% #859B82	RGB 133 155 130	#859B82
50.0%	50.0% #8FA586	RGB 143 165 134	#8FA586
66.7%	66.7% #9CAF8A	RGB 156 175 138	#9CAF8A
83.3%	83.3% #ACB98D	RGB 172 185 141	#ACB98D
100.0%	100.0% #BEC490	RGB 190 196 144	#BEC490

#78877C #7D917E #859B82 #8FA586 #9CAF8A #ACB98D #BEC490

#78877C - #8FA586 - #BEC490

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #78877C 0%, #8FA586 50%, #BEC490 100%);
    background: -webkit-linear-gradient(top, #78877C 0%, #8FA586 50%, #BEC490 100%);
    background: linear-gradient(to bottom, #78877C 0%, #8FA586 50%, #BEC490 100%);
}
</style>