#ED3123 - #F9C4C0 | colorate

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

Blend #ED3123 to #F9C4C0

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

RGBブレンド

#ED3123 - #F9C4C0 | colorate

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

0.0%	0.0% #ED3123	RGB 237 49 35	#ED3123
16.7%	16.7% #EF493D	RGB 239 73 61	#EF493D
33.3%	33.3% #F16257	RGB 241 98 87	#F16257
50.0%	50.0% #F37A71	RGB 243 122 113	#F37A71
66.7%	66.7% #F5938B	RGB 245 147 139	#F5938B
83.3%	83.3% #F7ABA5	RGB 247 171 165	#F7ABA5
100.0%	100.0% #F9C4C0	RGB 249 196 192	#F9C4C0

#ED3123 #EF493D #F16257 #F37A71 #F5938B #F7ABA5 #F9C4C0

#ED3123 - #F9C4C0

HSVブレンド

#ED3123 - #F9C4C0 | colorate

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

0.0%	0.0% #ED3123	RGB 237 49 35	#ED3123
16.7%	16.7% #EF483C	RGB 239 72 60	#EF483C
33.3%	33.3% #F16055	RGB 241 96 85	#F16055
50.0%	50.0% #F3786F	RGB 243 120 111	#F3786F
66.7%	66.7% #F5918A	RGB 245 145 138	#F5918A
83.3%	83.3% #F7AAA4	RGB 247 170 164	#F7AAA4
100.0%	100.0% #F9C4C0	RGB 249 196 192	#F9C4C0

#ED3123 #EF483C #F16055 #F3786F #F5918A #F7AAA4 #F9C4C0

#ED3123 - #F3786F - #F9C4C0

CSSコード

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

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