#AC2FFF - #3C00C2 | colorate

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

Blend #AC2FFF to #3C00C2

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

RGBブレンド

#AC2FFF - #3C00C2 | colorate

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

0.0%	0.0% #AC2FFF	RGB 172 47 255	#AC2FFF
16.7%	16.7% #9927F4	RGB 153 39 244	#9927F4
33.3%	33.3% #861FEA	RGB 134 31 234	#861FEA
50.0%	50.0% #7417E0	RGB 116 23 224	#7417E0
66.7%	66.7% #610FD6	RGB 97 15 214	#610FD6
83.3%	83.3% #4E07CC	RGB 78 7 204	#4E07CC
100.0%	100.0% #3C00C2	RGB 60 0 194	#3C00C2

#AC2FFF #9927F4 #861FEA #7417E0 #610FD6 #4E07CC #3C00C2

#AC2FFF - #3C00C2

HSVブレンド

#AC2FFF - #3C00C2 | colorate

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

0.0%	0.0% #AC2EFF	RGB 172 46 255	#AC2EFF
16.7%	16.7% #9825F4	RGB 152 37 244	#9825F4
33.3%	33.3% #841CEA	RGB 132 28 234	#841CEA
50.0%	50.0% #7114E0	RGB 113 20 224	#7114E0
66.7%	66.7% #5E0DD6	RGB 94 13 214	#5E0DD6
83.3%	83.3% #4D06CC	RGB 77 6 204	#4D06CC
100.0%	100.0% #3C00C2	RGB 60 0 194	#3C00C2

#AC2EFF #9825F4 #841CEA #7114E0 #5E0DD6 #4D06CC #3C00C2

#AC2FFF - #7114E0 - #3C00C2

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AC2EFF 0%, #7114E0 50%, #3C00C2 100%);
    background: -webkit-linear-gradient(top, #AC2EFF 0%, #7114E0 50%, #3C00C2 100%);
    background: linear-gradient(to bottom, #AC2EFF 0%, #7114E0 50%, #3C00C2 100%);
}
</style>