#DC366B - #FF967E | colorate

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

Blend #DC366B to #FF967E

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

RGBブレンド

#DC366B - #FF967E | colorate

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

0.0%	0.0% #DC366B	RGB 220 54 107	#DC366B
16.7%	16.7% #E1466E	RGB 225 70 110	#E1466E
33.3%	33.3% #E75671	RGB 231 86 113	#E75671
50.0%	50.0% #ED6674	RGB 237 102 116	#ED6674
66.7%	66.7% #F37677	RGB 243 118 119	#F37677
83.3%	83.3% #F9867A	RGB 249 134 122	#F9867A
100.0%	100.0% #FF967E	RGB 255 150 126	#FF967E

#DC366B #E1466E #E75671 #ED6674 #F37677 #F9867A #FF967E

#DC366B - #FF967E

HSVブレンド

#DC366B - #FF967E | colorate

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

0.0%	0.0% #DC366B	RGB 220 54 107	#DC366B
16.7%	16.7% #E14066	RGB 225 64 102	#E14066
33.3%	33.3% #E74C63	RGB 231 76 99	#E74C63
50.0%	50.0% #ED5761	RGB 237 87 97	#ED5761
66.7%	66.7% #F36664	RGB 243 102 100	#F36664
83.3%	83.3% #F97E70	RGB 249 126 112	#F97E70
100.0%	100.0% #FF967E	RGB 255 150 126	#FF967E

#DC366B #E14066 #E74C63 #ED5761 #F36664 #F97E70 #FF967E

#DC366B - #ED5761 - #FF967E

CSSコード

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

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