#004747 - #429A78 | colorate

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

Blend #004747 to #429A78

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

RGBブレンド

#004747 - #429A78 | colorate

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

0.0%	0.0% #004747	RGB 0 71 71	#004747
16.7%	16.7% #0B544F	RGB 11 84 79	#0B544F
33.3%	33.3% #166257	RGB 22 98 87	#166257
50.0%	50.0% #21705F	RGB 33 112 95	#21705F
66.7%	66.7% #2C7E67	RGB 44 126 103	#2C7E67
83.3%	83.3% #378C6F	RGB 55 140 111	#378C6F
100.0%	100.0% #429A78	RGB 66 154 120	#429A78

#004747 #0B544F #166257 #21705F #2C7E67 #378C6F #429A78

#004747 - #429A78

HSVブレンド

#004747 - #429A78 | colorate

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

0.0%	0.0% #004747	RGB 0 71 71	#004747
16.7%	16.7% #06544F	RGB 6 84 79	#06544F
33.3%	33.3% #0E6257	RGB 14 98 87	#0E6257
50.0%	50.0% #18705F	RGB 24 112 95	#18705F
66.7%	66.7% #247E67	RGB 36 126 103	#247E67
83.3%	83.3% #328C6F	RGB 50 140 111	#328C6F
100.0%	100.0% #429A78	RGB 66 154 120	#429A78

#004747 #06544F #0E6257 #18705F #247E67 #328C6F #429A78

#004747 - #18705F - #429A78

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #004747 0%, #18705F 50%, #429A78 100%);
    background: -webkit-linear-gradient(top, #004747 0%, #18705F 50%, #429A78 100%);
    background: linear-gradient(to bottom, #004747 0%, #18705F 50%, #429A78 100%);
}
</style>