#285490 - #02285C | colorate

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

Blend #285490 to #02285C

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

RGBブレンド

#285490 - #02285C | colorate

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

0.0%	0.0% #285490	RGB 40 84 144	#285490
16.7%	16.7% #214C87	RGB 33 76 135	#214C87
33.3%	33.3% #1B457E	RGB 27 69 126	#1B457E
50.0%	50.0% #153E76	RGB 21 62 118	#153E76
66.7%	66.7% #0E366D	RGB 14 54 109	#0E366D
83.3%	83.3% #082F64	RGB 8 47 100	#082F64
100.0%	100.0% #02285C	RGB 2 40 92	#02285C

#285490 #214C87 #1B457E #153E76 #0E366D #082F64 #02285C

#285490 - #02285C

HSVブレンド

#285490 - #02285C | colorate

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

0.0%	0.0% #285490	RGB 40 84 144	#285490
16.7%	16.7% #1F4B87	RGB 31 75 135	#1F4B87
33.3%	33.3% #18437E	RGB 24 67 126	#18437E
50.0%	50.0% #113C76	RGB 17 60 118	#113C76
66.7%	66.7% #0B346D	RGB 11 52 109	#0B346D
83.3%	83.3% #062E64	RGB 6 46 100	#062E64
100.0%	100.0% #02285C	RGB 2 40 92	#02285C

#285490 #1F4B87 #18437E #113C76 #0B346D #062E64 #02285C

#285490 - #113C76 - #02285C

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #285490 0%, #113C76 50%, #02285C 100%);
    background: -webkit-linear-gradient(top, #285490 0%, #113C76 50%, #02285C 100%);
    background: linear-gradient(to bottom, #285490 0%, #113C76 50%, #02285C 100%);
}
</style>