#014291 - #4B9BD4 | colorate

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

Blend #014291 to #4B9BD4

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

RGBブレンド

#014291 - #4B9BD4 | colorate

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

0.0%	0.0% #014291	RGB 1 66 145	#014291
16.7%	16.7% #0D509C	RGB 13 80 156	#0D509C
33.3%	33.3% #195FA7	RGB 25 95 167	#195FA7
50.0%	50.0% #266EB2	RGB 38 110 178	#266EB2
66.7%	66.7% #327DBD	RGB 50 125 189	#327DBD
83.3%	83.3% #3E8CC8	RGB 62 140 200	#3E8CC8
100.0%	100.0% #4B9BD4	RGB 75 155 212	#4B9BD4

#014291 #0D509C #195FA7 #266EB2 #327DBD #3E8CC8 #4B9BD4

#014291 - #4B9BD4

HSVブレンド

#014291 - #4B9BD4 | colorate

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

0.0%	0.0% #014191	RGB 1 65 145	#014191
16.7%	16.7% #0A4F9C	RGB 10 79 156	#0A4F9C
33.3%	33.3% #145DA7	RGB 20 93 167	#145DA7
50.0%	50.0% #206BB2	RGB 32 107 178	#206BB2
66.7%	66.7% #2D7BBD	RGB 45 123 189	#2D7BBD
83.3%	83.3% #3B8AC8	RGB 59 138 200	#3B8AC8
100.0%	100.0% #4B9BD4	RGB 75 155 212	#4B9BD4

#014191 #0A4F9C #145DA7 #206BB2 #2D7BBD #3B8AC8 #4B9BD4

#014291 - #206BB2 - #4B9BD4

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #014191 0%, #206BB2 50%, #4B9BD4 100%);
    background: -webkit-linear-gradient(top, #014191 0%, #206BB2 50%, #4B9BD4 100%);
    background: linear-gradient(to bottom, #014191 0%, #206BB2 50%, #4B9BD4 100%);
}
</style>