#33608F - #3B2F9B | colorate

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

Blend #33608F to #3B2F9B

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

RGBブレンド

#33608F - #3B2F9B | colorate

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

0.0%	0.0% #33608F	RGB 51 96 143	#33608F
16.7%	16.7% #345791	RGB 52 87 145	#345791
33.3%	33.3% #354F93	RGB 53 79 147	#354F93
50.0%	50.0% #374795	RGB 55 71 149	#374795
66.7%	66.7% #383F97	RGB 56 63 151	#383F97
83.3%	83.3% #393799	RGB 57 55 153	#393799
100.0%	100.0% #3B2F9B	RGB 59 47 155	#3B2F9B

#33608F #345791 #354F93 #374795 #383F97 #393799 #3B2F9B

#33608F - #3B2F9B

HSVブレンド

#33608F - #3B2F9B | colorate

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

0.0%	0.0% #33608F	RGB 51 96 143	#33608F
16.7%	16.7% #325791	RGB 50 87 145	#325791
33.3%	33.3% #314D93	RGB 49 77 147	#314D93
50.0%	50.0% #314495	RGB 49 68 149	#314495
66.7%	66.7% #303997	RGB 48 57 151	#303997
83.3%	83.3% #302F99	RGB 48 47 153	#302F99
100.0%	100.0% #3B2F9B	RGB 59 47 155	#3B2F9B

#33608F #325791 #314D93 #314495 #303997 #302F99 #3B2F9B

#33608F - #314495 - #3B2F9B

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #33608F 0%, #314495 50%, #3B2F9B 100%);
    background: -webkit-linear-gradient(top, #33608F 0%, #314495 50%, #3B2F9B 100%);
    background: linear-gradient(to bottom, #33608F 0%, #314495 50%, #3B2F9B 100%);
}
</style>