#254740 - #3F2547 | colorate

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

Blend #254740 to #3F2547

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

RGBブレンド

#254740 - #3F2547 | colorate

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

0.0%	0.0% #254740	RGB 37 71 64	#254740
16.7%	16.7% #294141	RGB 41 65 65	#294141
33.3%	33.3% #2D3B42	RGB 45 59 66	#2D3B42
50.0%	50.0% #323643	RGB 50 54 67	#323643
66.7%	66.7% #363044	RGB 54 48 68	#363044
83.3%	83.3% #3A2A45	RGB 58 42 69	#3A2A45
100.0%	100.0% #3F2547	RGB 63 37 71	#3F2547

#254740 #294141 #2D3B42 #323643 #363044 #3A2A45 #3F2547

#254740 - #3F2547

HSVブレンド

#254740 - #3F2547 | colorate

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

0.0%	0.0% #254740	RGB 37 71 64	#254740
16.7%	16.7% #254247	RGB 37 66 71	#254247
33.3%	33.3% #253747	RGB 37 55 71	#253747
50.0%	50.0% #252C47	RGB 37 44 71	#252C47
66.7%	66.7% #282547	RGB 40 37 71	#282547
83.3%	83.3% #332547	RGB 51 37 71	#332547
100.0%	100.0% #3F2547	RGB 63 37 71	#3F2547

#254740 #254247 #253747 #252C47 #282547 #332547 #3F2547

#254740 - #252C47 - #3F2547

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #254740 0%, #252C47 50%, #3F2547 100%);
    background: -webkit-linear-gradient(top, #254740 0%, #252C47 50%, #3F2547 100%);
    background: linear-gradient(to bottom, #254740 0%, #252C47 50%, #3F2547 100%);
}
</style>