#AF3DA2 - #FB71A8 | colorate

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

Blend #AF3DA2 to #FB71A8

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

RGBブレンド

#AF3DA2 - #FB71A8 | colorate

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

0.0%	0.0% #AF3DA2	RGB 175 61 162	#AF3DA2
16.7%	16.7% #BB45A3	RGB 187 69 163	#BB45A3
33.3%	33.3% #C84EA4	RGB 200 78 164	#C84EA4
50.0%	50.0% #D557A5	RGB 213 87 165	#D557A5
66.7%	66.7% #E15FA6	RGB 225 95 166	#E15FA6
83.3%	83.3% #EE68A7	RGB 238 104 167	#EE68A7
100.0%	100.0% #FB71A8	RGB 251 113 168	#FB71A8

#AF3DA2 #BB45A3 #C84EA4 #D557A5 #E15FA6 #EE68A7 #FB71A8

#AF3DA2 - #FB71A8

HSVブレンド

#AF3DA2 - #FB71A8 | colorate

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

0.0%	0.0% #AF3DA1	RGB 175 61 161	#AF3DA1
16.7%	16.7% #BB44A4	RGB 187 68 164	#BB44A4
33.3%	33.3% #C84CA6	RGB 200 76 166	#C84CA6
50.0%	50.0% #D555A7	RGB 213 85 167	#D555A7
66.7%	66.7% #E15DA7	RGB 225 93 167	#E15DA7
83.3%	83.3% #EE67A8	RGB 238 103 168	#EE67A8
100.0%	100.0% #FB71A8	RGB 251 113 168	#FB71A8

#AF3DA1 #BB44A4 #C84CA6 #D555A7 #E15DA7 #EE67A8 #FB71A8

#AF3DA2 - #D555A7 - #FB71A8

CSSコード

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

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