#378F46 - #217548 | colorate

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

Blend #378F46 to #217548

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

RGBブレンド

#378F46 - #217548 | colorate

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

0.0%	0.0% #378F46	RGB 55 143 70	#378F46
16.7%	16.7% #338A46	RGB 51 138 70	#338A46
33.3%	33.3% #2F8646	RGB 47 134 70	#2F8646
50.0%	50.0% #2C8247	RGB 44 130 71	#2C8247
66.7%	66.7% #287D47	RGB 40 125 71	#287D47
83.3%	83.3% #247947	RGB 36 121 71	#247947
100.0%	100.0% #217548	RGB 33 117 72	#217548

#378F46 #338A46 #2F8646 #2C8247 #287D47 #247947 #217548

#378F46 - #217548

HSVブレンド

#378F46 - #217548 | colorate

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

0.0%	0.0% #378F45	RGB 55 143 69	#378F45
16.7%	16.7% #328A46	RGB 50 138 70	#328A46
33.3%	33.3% #2F8646	RGB 47 134 70	#2F8646
50.0%	50.0% #2B8246	RGB 43 130 70	#2B8246
66.7%	66.7% #277D47	RGB 39 125 71	#277D47
83.3%	83.3% #247947	RGB 36 121 71	#247947
100.0%	100.0% #217548	RGB 33 117 72	#217548

#378F45 #328A46 #2F8646 #2B8246 #277D47 #247947 #217548

#378F46 - #2B8246 - #217548

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #378F45 0%, #2B8246 50%, #217548 100%);
    background: -webkit-linear-gradient(top, #378F45 0%, #2B8246 50%, #217548 100%);
    background: linear-gradient(to bottom, #378F45 0%, #2B8246 50%, #217548 100%);
}
</style>