#3D316C - #220618 | colorate

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

Blend #3D316C to #220618

#3D316C #220618

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

RGBブレンド

#3D316C - #220618 | colorate

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

0.0%	0.0% #3D316C	RGB 61 49 108	#3D316C
16.7%	16.7% #38295E	RGB 56 41 94	#38295E
33.3%	33.3% #342250	RGB 52 34 80	#342250
50.0%	50.0% #2F1B42	RGB 47 27 66	#2F1B42
66.7%	66.7% #2B1434	RGB 43 20 52	#2B1434
83.3%	83.3% #260D26	RGB 38 13 38	#260D26
100.0%	100.0% #220618	RGB 34 6 24	#220618

#3D316C #38295E #342250 #2F1B42 #2B1434 #260D26 #220618

#3D316C - #220618

HSVブレンド

#3D316C - #220618 | colorate

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

0.0%	0.0% #3D316C	RGB 61 49 108	#3D316C
16.7%	16.7% #3D265F	RGB 61 38 95	#3D265F
33.3%	33.3% #3D1E53	RGB 61 30 83	#3D1E53
50.0%	50.0% #3C1647	RGB 60 22 71	#3C1647
66.7%	66.7% #390F3A	RGB 57 15 58	#390F3A
83.3%	83.3% #2E0A28	RGB 46 10 40	#2E0A28
100.0%	100.0% #220618	RGB 34 6 24	#220618

#3D316C #3D265F #3D1E53 #3C1647 #390F3A #2E0A28 #220618

#3D316C - #3C1647 - #220618

CSSコード

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

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