#4E6690 - #6AB1FC | colorate

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

Blend #4E6690 to #6AB1FC

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

RGBブレンド

#4E6690 - #6AB1FC | colorate

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

0.0%	0.0% #4E6690	RGB 78 102 144	#4E6690
16.7%	16.7% #5272A2	RGB 82 114 162	#5272A2
33.3%	33.3% #577FB4	RGB 87 127 180	#577FB4
50.0%	50.0% #5C8BC6	RGB 92 139 198	#5C8BC6
66.7%	66.7% #6098D8	RGB 96 152 216	#6098D8
83.3%	83.3% #65A4EA	RGB 101 164 234	#65A4EA
100.0%	100.0% #6AB1FC	RGB 106 177 252	#6AB1FC

#4E6690 #5272A2 #577FB4 #5C8BC6 #6098D8 #65A4EA #6AB1FC

#4E6690 - #6AB1FC

HSVブレンド

#4E6690 - #6AB1FC | colorate

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

0.0%	0.0% #4E6690	RGB 78 102 144	#4E6690
16.7%	16.7% #5472A2	RGB 84 114 162	#5472A2
33.3%	33.3% #5A7EB4	RGB 90 126 180	#5A7EB4
50.0%	50.0% #5F8AC6	RGB 95 138 198	#5F8AC6
66.7%	66.7% #6397D8	RGB 99 151 216	#6397D8
83.3%	83.3% #67A4EA	RGB 103 164 234	#67A4EA
100.0%	100.0% #6AB1FC	RGB 106 177 252	#6AB1FC

#4E6690 #5472A2 #5A7EB4 #5F8AC6 #6397D8 #67A4EA #6AB1FC

#4E6690 - #5F8AC6 - #6AB1FC

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4E6690 0%, #5F8AC6 50%, #6AB1FC 100%);
    background: -webkit-linear-gradient(top, #4E6690 0%, #5F8AC6 50%, #6AB1FC 100%);
    background: linear-gradient(to bottom, #4E6690 0%, #5F8AC6 50%, #6AB1FC 100%);
}
</style>