#DC1324 - #F5BBC0 | colorate

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

Blend #DC1324 to #F5BBC0

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

RGBブレンド

#DC1324 - #F5BBC0 | colorate

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

0.0%	0.0% #DC1324	RGB 220 19 36	#DC1324
16.7%	16.7% #E02F3E	RGB 224 47 62	#E02F3E
33.3%	33.3% #E44B58	RGB 228 75 88	#E44B58
50.0%	50.0% #E86772	RGB 232 103 114	#E86772
66.7%	66.7% #EC838C	RGB 236 131 140	#EC838C
83.3%	83.3% #F09FA6	RGB 240 159 166	#F09FA6
100.0%	100.0% #F5BBC0	RGB 245 187 192	#F5BBC0

#DC1324 #E02F3E #E44B58 #E86772 #EC838C #F09FA6 #F5BBC0

#DC1324 - #F5BBC0

HSVブレンド

#DC1324 - #F5BBC0 | colorate

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

0.0%	0.0% #DC1224	RGB 220 18 36	#DC1224
16.7%	16.7% #E02C3B	RGB 224 44 59	#E02C3B
33.3%	33.3% #E44754	RGB 228 71 84	#E44754
50.0%	50.0% #E8626E	RGB 232 98 110	#E8626E
66.7%	66.7% #EC7F88	RGB 236 127 136	#EC7F88
83.3%	83.3% #F09CA3	RGB 240 156 163	#F09CA3
100.0%	100.0% #F5BBC0	RGB 245 187 192	#F5BBC0

#DC1224 #E02C3B #E44754 #E8626E #EC7F88 #F09CA3 #F5BBC0

#DC1324 - #E8626E - #F5BBC0

CSSコード

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

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