#000064 - #0638B0 | colorate

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

Blend #000064 to #0638B0

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

RGBブレンド

#000064 - #0638B0 | colorate

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

0.0%	0.0% #000064	RGB 0 0 100	#000064
16.7%	16.7% #010970	RGB 1 9 112	#010970
33.3%	33.3% #02127D	RGB 2 18 125	#02127D
50.0%	50.0% #031C8A	RGB 3 28 138	#031C8A
66.7%	66.7% #042596	RGB 4 37 150	#042596
83.3%	83.3% #052EA3	RGB 5 46 163	#052EA3
100.0%	100.0% #0638B0	RGB 6 56 176	#0638B0

#000064 #010970 #02127D #031C8A #042596 #052EA3 #0638B0

#000064 - #0638B0

HSVブレンド

#000064 - #0638B0 | colorate

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

0.0%	0.0% #000064	RGB 0 0 100	#000064
16.7%	16.7% #000670	RGB 0 6 112	#000670
33.3%	33.3% #010D7D	RGB 1 13 125	#010D7D
50.0%	50.0% #02168A	RGB 2 22 138	#02168A
66.7%	66.7% #032096	RGB 3 32 150	#032096
83.3%	83.3% #042BA3	RGB 4 43 163	#042BA3
100.0%	100.0% #0638B0	RGB 6 56 176	#0638B0

#000064 #000670 #010D7D #02168A #032096 #042BA3 #0638B0

#000064 - #02168A - #0638B0

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #000064 0%, #02168A 50%, #0638B0 100%);
    background: -webkit-linear-gradient(top, #000064 0%, #02168A 50%, #0638B0 100%);
    background: linear-gradient(to bottom, #000064 0%, #02168A 50%, #0638B0 100%);
}
</style>