#20498F - #061854 | colorate

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

Blend #20498F to #061854

#20498F #061854

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

RGBブレンド

#20498F - #061854 | colorate

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

0.0%	0.0% #20498F	RGB 32 73 143	#20498F
16.7%	16.7% #1B4085	RGB 27 64 133	#1B4085
33.3%	33.3% #17387B	RGB 23 56 123	#17387B
50.0%	50.0% #133071	RGB 19 48 113	#133071
66.7%	66.7% #0E2867	RGB 14 40 103	#0E2867
83.3%	83.3% #0A205D	RGB 10 32 93	#0A205D
100.0%	100.0% #061854	RGB 6 24 84	#061854

#20498F #1B4085 #17387B #133071 #0E2867 #0A205D #061854

#20498F - #061854

HSVブレンド

#20498F - #061854 | colorate

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

0.0%	0.0% #20498F	RGB 32 73 143	#20498F
16.7%	16.7% #1A3F85	RGB 26 63 133	#1A3F85
33.3%	33.3% #15367B	RGB 21 54 123	#15367B
50.0%	50.0% #102D71	RGB 16 45 113	#102D71
66.7%	66.7% #0C2567	RGB 12 37 103	#0C2567
83.3%	83.3% #091E5D	RGB 9 30 93	#091E5D
100.0%	100.0% #061854	RGB 6 24 84	#061854

#20498F #1A3F85 #15367B #102D71 #0C2567 #091E5D #061854

#20498F - #102D71 - #061854

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #20498F 0%, #102D71 50%, #061854 100%);
    background: -webkit-linear-gradient(top, #20498F 0%, #102D71 50%, #061854 100%);
    background: linear-gradient(to bottom, #20498F 0%, #102D71 50%, #061854 100%);
}
</style>