#6B7EAD - #1E3E5A | colorate

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

Blend #6B7EAD to #1E3E5A

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

RGBブレンド

#6B7EAD - #1E3E5A | colorate

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

0.0%	0.0% #6B7EAD	RGB 107 126 173	#6B7EAD
16.7%	16.7% #5E739F	RGB 94 115 159	#5E739F
33.3%	33.3% #516891	RGB 81 104 145	#516891
50.0%	50.0% #445E83	RGB 68 94 131	#445E83
66.7%	66.7% #375375	RGB 55 83 117	#375375
83.3%	83.3% #2A4867	RGB 42 72 103	#2A4867
100.0%	100.0% #1E3E5A	RGB 30 62 90	#1E3E5A

#6B7EAD #5E739F #516891 #445E83 #375375 #2A4867 #1E3E5A

#6B7EAD - #1E3E5A

HSVブレンド

#6B7EAD - #1E3E5A | colorate

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

0.0%	0.0% #6B7EAD	RGB 107 126 173	#6B7EAD
16.7%	16.7% #5A719F	RGB 90 113 159	#5A719F
33.3%	33.3% #4C6591	RGB 76 101 145	#4C6591
50.0%	50.0% #3E5A83	RGB 62 90 131	#3E5A83
66.7%	66.7% #325075	RGB 50 80 117	#325075
83.3%	83.3% #274767	RGB 39 71 103	#274767
100.0%	100.0% #1E3E5A	RGB 30 62 90	#1E3E5A

#6B7EAD #5A719F #4C6591 #3E5A83 #325075 #274767 #1E3E5A

#6B7EAD - #3E5A83 - #1E3E5A

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6B7EAD 0%, #3E5A83 50%, #1E3E5A 100%);
    background: -webkit-linear-gradient(top, #6B7EAD 0%, #3E5A83 50%, #1E3E5A 100%);
    background: linear-gradient(to bottom, #6B7EAD 0%, #3E5A83 50%, #1E3E5A 100%);
}
</style>