#323639 - #6290A1 | colorate

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

Blend #323639 to #6290A1

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

RGBブレンド

#323639 - #6290A1 | colorate

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

0.0%	0.0% #323639	RGB 50 54 57	#323639
16.7%	16.7% #3A454A	RGB 58 69 74	#3A454A
33.3%	33.3% #42545B	RGB 66 84 91	#42545B
50.0%	50.0% #4A636D	RGB 74 99 109	#4A636D
66.7%	66.7% #52727E	RGB 82 114 126	#52727E
83.3%	83.3% #5A818F	RGB 90 129 143	#5A818F
100.0%	100.0% #6290A1	RGB 98 144 161	#6290A1

#323639 #3A454A #42545B #4A636D #52727E #5A818F #6290A1

#323639 - #6290A1

HSVブレンド

#323639 - #6290A1 | colorate

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

0.0%	0.0% #323639	RGB 50 54 57	#323639
16.7%	16.7% #3D454A	RGB 61 69 74	#3D454A
33.3%	33.3% #48545B	RGB 72 84 91	#48545B
50.0%	50.0% #50636D	RGB 80 99 109	#50636D
66.7%	66.7% #58727E	RGB 88 114 126	#58727E
83.3%	83.3% #5D808F	RGB 93 128 143	#5D808F
100.0%	100.0% #6290A1	RGB 98 144 161	#6290A1

#323639 #3D454A #48545B #50636D #58727E #5D808F #6290A1

#323639 - #50636D - #6290A1

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #323639 0%, #50636D 50%, #6290A1 100%);
    background: -webkit-linear-gradient(top, #323639 0%, #50636D 50%, #6290A1 100%);
    background: linear-gradient(to bottom, #323639 0%, #50636D 50%, #6290A1 100%);
}
</style>