#C71585
MediumVioletRed — カラーコードとパレット
#C71585 · rgb(199, 21, 133) · hsl(322, 81%, 43%)
カラーコード
| 形式 | 値 | |
|---|---|---|
| HEX | #C71585 | |
| RGB | rgb(199, 21, 133) | |
| HSL | hsl(322, 81%, 43%) |
MediumVioletRedのシェード（暗色系）
| #B41379 | #A2116D | #8F0F60 | #7D0D54 | #6A0B47 | #58093B | #45072F | #330522 |
MediumVioletRedのティント（淡色系）
| #E21898 | #E92FA5 | #EC4BB1 | #EF67BD | #F282C9 | #F59ED5 | #F8BAE1 | #FBD5ED |
カラーペアリングとハーモニー
|
補色
#15C656
|
類似色 +30°
#C6152D
|
類似色 −30°
#AF15C6
|
トライアド +120°
#85C615
|
トライアド −120°
#1585C6
|
コントラストとアクセシビリティ（WCAG 2.1）
白（#FFFFFF）との対比
5.42:1 — 通常テキストでAAパス
黒（#000000）との対比
3.87:1 — 大きいテキストのみAAパス
CSSスニペット
.element {
color: #C71585;
}
.element-bg {
background-color: #C71585;
color: #ffffff;
}
.element-border {
border: 2px solid #C71585;
}
MediumVioletRedについて
MediumVioletRedはhsl(322, 81%, 43%)（色相322°、彩度81%、明度43%）で定義される中間の明度のの鮮やかで高彩度カラーで、HEXコードは#C71585です。正確なカラーモデル値はRGBでrgb(199, 21, 133)、HSLでhsl(322, 81%, 43%)です。白背景でのコントラスト比は5.42:1 — 通常テキストでAAパス、黒背景では3.87:1 — 大きいテキストのみAAパスです。MediumVioletRedはUI要素・背景・テキスト・ボーダー・装飾アクセントなど多用途に活用できます。下のシェードセクションでは徐々に暗くなるバリエーションを、ティントストリップでは徐々に明るくなるバリエーションを確認でき、トーンパレットの構築に役立ちます。ハーモニースウォッチはHSL色相環に基づく補色・類似色・トライアドを提供します。
色をインタラクティブに確認したい、パレットを生成したい、カラー形式を変換したいですか？DevArborのカラーピッカーをご活用ください。
カラーピッカーを開く →よくある質問
MediumVioletRedのRGB値は何ですか？
MediumVioletRed（#C71585）のRGB値は rgb(199, 21, 133) です。Red・Green・Blueそれぞれの光の量を0〜255のスケールで表しています。
MediumVioletRedは白背景でアクセシブルですか？
MediumVioletRedと白（#FFFFFF）のコントラスト比は 5.42:1 — 通常テキストでAAパス です。黒（#000000）との比は 3.87:1 — 大きいテキストのみAAパス です。WCAG 2.1ではAA（通常テキスト）に4.5:1、AAAに7:1以上が必要とされています。
MediumVioletRedに合う色は何ですか？
カラー理論に基づくと、MediumVioletRed（hsl(322, 81%, 43%)）は補色・類似色・トライアドと相性がよいです。各ペアリングタイプの正確なHEX値は上のハーモニースウォッチを参照してください。