#F0AFCC - #DA5E8B | colorate
colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。
サイトをよりよくする
Blend #F0AFCC to #DA5E8B
#F0AFCCと#DA5E8Bの二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。
RGBブレンド
#F0AFCC - #DA5E8B | colorate
RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#F0AFCCを0%、#DA5E8Bを100%として二色間の色を展開します。
0.0% #F0AFCC |
RGB 240 175 204 | #F0AFCC |
16.7% #ECA1C1 |
RGB 236 161 193 | #ECA1C1 |
33.3% #E894B6 |
RGB 232 148 182 | #E894B6 |
50.0% #E586AB |
RGB 229 134 171 | #E586AB |
66.7% #E179A0 |
RGB 225 121 160 | #E179A0 |
83.3% #DD6B95 |
RGB 221 107 149 | #DD6B95 |
100.0% #DA5E8B |
RGB 218 94 139 | #DA5E8B |
HSVブレンド
#F0AFCC - #DA5E8B | colorate
HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#F0AFCCを0%、#DA5E8Bを100%として二色間の色を展開します。
0.0% #F0AFCC |
RGB 240 175 204 | #F0AFCC |
16.7% #ECA0C1 |
RGB 236 160 193 | #ECA0C1 |
33.3% #E892B6 |
RGB 232 146 182 | #E892B6 |
50.0% #E584AB |
RGB 229 132 171 | #E584AB |
66.7% #E177A0 |
RGB 225 119 160 | #E177A0 |
83.3% #DD6A95 |
RGB 221 106 149 | #DD6A95 |
100.0% #DA5E8B |
RGB 218 94 139 | #DA5E8B |
CSSコード
<style type="text/css"> /* RGB Gradient */ div { background: -moz-linear-gradient(top, #F0AFCC 0%, #DA5E8B 100%); background: -webkit-linear-gradient(top, #F0AFCC 0%, #DA5E8B 100%); background: linear-gradient(to bottom, #F0AFCC 0%, #DA5E8B 100%); } /* HSV Gradient */ div { background: -moz-linear-gradient(top, #F0AFCC 0%, #E584AB 50%, #DA5E8B 100%); background: -webkit-linear-gradient(top, #F0AFCC 0%, #E584AB 50%, #DA5E8B 100%); background: linear-gradient(to bottom, #F0AFCC 0%, #E584AB 50%, #DA5E8B 100%); } </style>