#0065DA - #162A76 | colorate

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

Blend #0065DA to #162A76

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

RGBブレンド

#0065DA - #162A76 | colorate

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

0.0%	0.0% #0065DA	RGB 0 101 218	#0065DA
16.7%	16.7% #035BC9	RGB 3 91 201	#035BC9
33.3%	33.3% #0751B8	RGB 7 81 184	#0751B8
50.0%	50.0% #0B47A8	RGB 11 71 168	#0B47A8
66.7%	66.7% #0E3D97	RGB 14 61 151	#0E3D97
83.3%	83.3% #123386	RGB 18 51 134	#123386
100.0%	100.0% #162A76	RGB 22 42 118	#162A76

#0065DA #035BC9 #0751B8 #0B47A8 #0E3D97 #123386 #162A76

#0065DA - #162A76

HSVブレンド

#0065DA - #162A76 | colorate

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

0.0%	0.0% #0065DA	RGB 0 101 218	#0065DA
16.7%	16.7% #0658C9	RGB 6 88 201	#0658C9
33.3%	33.3% #0B4CB8	RGB 11 76 184	#0B4CB8
50.0%	50.0% #0F42A8	RGB 15 66 168	#0F42A8
66.7%	66.7% #123997	RGB 18 57 151	#123997
83.3%	83.3% #143186	RGB 20 49 134	#143186
100.0%	100.0% #162A76	RGB 22 42 118	#162A76

#0065DA #0658C9 #0B4CB8 #0F42A8 #123997 #143186 #162A76

#0065DA - #0F42A8 - #162A76

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0065DA 0%, #0F42A8 50%, #162A76 100%);
    background: -webkit-linear-gradient(top, #0065DA 0%, #0F42A8 50%, #162A76 100%);
    background: linear-gradient(to bottom, #0065DA 0%, #0F42A8 50%, #162A76 100%);
}
</style>