#4A3D8F - #8F483D | colorate
colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。
サイトをよりよくする
Blend #4A3D8F to #8F483D
#4A3D8Fと#8F483Dの二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。
RGBブレンド
RGBブレンド
RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#4A3D8Fを0%、#8F483Dを100%として二色間の色を展開します。
0.0% #4A3D8F |
RGB 74 61 143 | #4A3D8F |
16.7% #553E82 |
RGB 85 62 130 | #553E82 |
33.3% #614074 |
RGB 97 64 116 | #614074 |
50.0% #6C4266 |
RGB 108 66 102 | #6C4266 |
66.7% #784459 |
RGB 120 68 89 | #784459 |
83.3% #83464B |
RGB 131 70 75 | #83464B |
100.0% #8F483D |
RGB 143 72 61 | #8F483D |
HSVブレンド
HSVブレンド
HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#4A3D8Fを0%、#8F483Dを100%として二色間の色を展開します。
0.0% #4A3D8F |
RGB 74 61 143 | #4A3D8F |
16.7% #653D8F |
RGB 101 61 143 | #653D8F |
33.3% #803D8F |
RGB 128 61 143 | #803D8F |
50.0% #8F3D82 |
RGB 143 61 130 | #8F3D82 |
66.7% #8F3D68 |
RGB 143 61 104 | #8F3D68 |
83.3% #8F3D4D |
RGB 143 61 77 | #8F3D4D |
100.0% #8F473D |
RGB 143 71 61 | #8F473D |
CSSコード
<style type="text/css"> /* RGB Gradation */ div { background: -moz-linear-gradient(top, #4A3D8F 0%, #8F483D 100%); background: -webkit-linear-gradient(top, #4A3D8F 0%, #8F483D 100%); background: linear-gradient(to bottom, #4A3D8F 0%, #8F483D 100%); } /* HSV Gradation */ div { background: -moz-linear-gradient(top, #4A3D8F 0%, #8F3D82 50%, #8F473D 100%); background: -webkit-linear-gradient(top, #4A3D8F 0%, #8F3D82 50%, #8F473D 100%); background: linear-gradient(to bottom, #4A3D8F 0%, #8F3D82 50%, #8F473D 100%); } </style>