#398890 - #123840 | colorate

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

Blend #398890 to #123840

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

RGBブレンド

#398890 - #123840 | colorate

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

0.0%	0.0% #398890	RGB 57 136 144	#398890
16.7%	16.7% #327A82	RGB 50 122 130	#327A82
33.3%	33.3% #2C6D75	RGB 44 109 117	#2C6D75
50.0%	50.0% #256068	RGB 37 96 104	#256068
66.7%	66.7% #1F525A	RGB 31 82 90	#1F525A
83.3%	83.3% #18454D	RGB 24 69 77	#18454D
100.0%	100.0% #123840	RGB 18 56 64	#123840

#398890 #327A82 #2C6D75 #256068 #1F525A #18454D #123840

#398890 - #123840

HSVブレンド

#398890 - #123840 | colorate

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

0.0%	0.0% #398890	RGB 57 136 144	#398890
16.7%	16.7% #317A82	RGB 49 122 130	#317A82
33.3%	33.3% #296C75	RGB 41 108 117	#296C75
50.0%	50.0% #235E68	RGB 35 94 104	#235E68
66.7%	66.7% #1C515A	RGB 28 81 90	#1C515A
83.3%	83.3% #17444D	RGB 23 68 77	#17444D
100.0%	100.0% #123840	RGB 18 56 64	#123840

#398890 #317A82 #296C75 #235E68 #1C515A #17444D #123840

#398890 - #235E68 - #123840

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #398890 0%, #235E68 50%, #123840 100%);
    background: -webkit-linear-gradient(top, #398890 0%, #235E68 50%, #123840 100%);
    background: linear-gradient(to bottom, #398890 0%, #235E68 50%, #123840 100%);
}
</style>