#0027DA - #000B3E | colorate

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

Blend #0027DA to #000B3E

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

RGBブレンド

#0027DA - #000B3E | colorate

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

0.0%	0.0% #0027DA	RGB 0 39 218	#0027DA
16.7%	16.7% #0022C0	RGB 0 34 192	#0022C0
33.3%	33.3% #001DA6	RGB 0 29 166	#001DA6
50.0%	50.0% #00198C	RGB 0 25 140	#00198C
66.7%	66.7% #001472	RGB 0 20 114	#001472
83.3%	83.3% #000F58	RGB 0 15 88	#000F58
100.0%	100.0% #000B3E	RGB 0 11 62	#000B3E

#0027DA #0022C0 #001DA6 #00198C #001472 #000F58 #000B3E

#0027DA - #000B3E

HSVブレンド

#0027DA - #000B3E | colorate

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

0.0%	0.0% #0026DA	RGB 0 38 218	#0026DA
16.7%	16.7% #0022C0	RGB 0 34 192	#0022C0
33.3%	33.3% #001DA6	RGB 0 29 166	#001DA6
50.0%	50.0% #00188C	RGB 0 24 140	#00188C
66.7%	66.7% #001472	RGB 0 20 114	#001472
83.3%	83.3% #000F58	RGB 0 15 88	#000F58
100.0%	100.0% #000B3E	RGB 0 11 62	#000B3E

#0026DA #0022C0 #001DA6 #00188C #001472 #000F58 #000B3E

#0027DA - #00188C - #000B3E

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0026DA 0%, #00188C 50%, #000B3E 100%);
    background: -webkit-linear-gradient(top, #0026DA 0%, #00188C 50%, #000B3E 100%);
    background: linear-gradient(to bottom, #0026DA 0%, #00188C 50%, #000B3E 100%);
}
</style>