#30378F - #672C9B | colorate

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

Blend #30378F to #672C9B

#30378F #672C9B

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

RGBブレンド

#30378F - #672C9B | colorate

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

0.0%	0.0% #30378F	RGB 48 55 143	#30378F
16.7%	16.7% #393591	RGB 57 53 145	#393591
33.3%	33.3% #423393	RGB 66 51 147	#423393
50.0%	50.0% #4B3195	RGB 75 49 149	#4B3195
66.7%	66.7% #542F97	RGB 84 47 151	#542F97
83.3%	83.3% #5D2D99	RGB 93 45 153	#5D2D99
100.0%	100.0% #672C9B	RGB 103 44 155	#672C9B

#30378F #393591 #423393 #4B3195 #542F97 #5D2D99 #672C9B

#30378F - #672C9B

HSVブレンド

#30378F - #672C9B | colorate

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

0.0%	0.0% #30368F	RGB 48 54 143	#30368F
16.7%	16.7% #322F91	RGB 50 47 145	#322F91
33.3%	33.3% #3B2E93	RGB 59 46 147	#3B2E93
50.0%	50.0% #452E95	RGB 69 46 149	#452E95
66.7%	66.7% #502D97	RGB 80 45 151	#502D97
83.3%	83.3% #5B2C99	RGB 91 44 153	#5B2C99
100.0%	100.0% #672C9B	RGB 103 44 155	#672C9B

#30368F #322F91 #3B2E93 #452E95 #502D97 #5B2C99 #672C9B

#30378F - #452E95 - #672C9B

CSSコード

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

/* HSV Gradation */
div {
    background: -moz-linear-gradient(top, #30368F 0%, #452E95 50%, #672C9B 100%);
    background: -webkit-linear-gradient(top, #30368F 0%, #452E95 50%, #672C9B 100%);
    background: linear-gradient(to bottom, #30368F 0%, #452E95 50%, #672C9B 100%);
}
</style>