#31112B - #613666 | colorate

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

Blend #31112B to #613666

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

RGBブレンド

#31112B - #613666 | colorate

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

0.0%	0.0% #31112B	RGB 49 17 43	#31112B
16.7%	16.7% #391734	RGB 57 23 52	#391734
33.3%	33.3% #411D3E	RGB 65 29 62	#411D3E
50.0%	50.0% #492348	RGB 73 35 72	#492348
66.7%	66.7% #512952	RGB 81 41 82	#512952
83.3%	83.3% #592F5C	RGB 89 47 92	#592F5C
100.0%	100.0% #613666	RGB 97 54 102	#613666

#31112B #391734 #411D3E #492348 #512952 #592F5C #613666

#31112B - #613666

HSVブレンド

#31112B - #613666 | colorate

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

0.0%	0.0% #31112A	RGB 49 17 42	#31112A
16.7%	16.7% #391534	RGB 57 21 52	#391534
33.3%	33.3% #421B3F	RGB 66 27 63	#421B3F
50.0%	50.0% #4B2149	RGB 75 33 73	#4B2149
66.7%	66.7% #542754	RGB 84 39 84	#542754
83.3%	83.3% #5A2E5D	RGB 90 46 93	#5A2E5D
100.0%	100.0% #613666	RGB 97 54 102	#613666

#31112A #391534 #421B3F #4B2149 #542754 #5A2E5D #613666

#31112B - #4B2149 - #613666

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #31112A 0%, #4B2149 50%, #613666 100%);
    background: -webkit-linear-gradient(top, #31112A 0%, #4B2149 50%, #613666 100%);
    background: linear-gradient(to bottom, #31112A 0%, #4B2149 50%, #613666 100%);
}
</style>