#9C27B0
#9C27B0 — カラーコードとパレット
#9C27B0 · rgb(156, 39, 176) · hsl(291, 64%, 42%)
カラーコード
| 形式 | 値 | |
|---|---|---|
| HEX | #9C27B0 | |
| RGB | rgb(156, 39, 176) | |
| HSL | hsl(291, 64%, 42%) |
#9C27B0のシェード（暗色系）
| #8C239F | #7E1F8E | #6F1C7D | #60186D | #51145C | #42114B | #340D3B | #25092A |
#9C27B0のティント（淡色系）
| #B12CC9 | #BE3FD5 | #C758DA | #CF71E0 | #D88AE5 | #E0A3EB | #E8BCF0 | #F1D5F6 |
カラーペアリングとハーモニー
|
補色
#3BB027
|
類似色 +30°
#B02780
|
類似色 −30°
#5727B0
|
トライアド +120°
#B09B27
|
トライアド −120°
#27B09B
|
コントラストとアクセシビリティ（WCAG 2.1）
白（#FFFFFF）との対比
6.30:1 — 通常テキストでAAパス
黒（#000000）との対比
3.33:1 — 大きいテキストのみAAパス
CSSスニペット
.element {
color: #9C27B0;
}
.element-bg {
background-color: #9C27B0;
color: #ffffff;
}
.element-border {
border: 2px solid #9C27B0;
}
#9C27B0について
#9C27B0はhsl(291, 64%, 42%)（色相291°、彩度64%、明度42%）で定義される中間の明度のの高い彩度カラーで、HEXコードは#9C27B0です。正確なカラーモデル値はRGBでrgb(156, 39, 176)、HSLでhsl(291, 64%, 42%)です。白背景でのコントラスト比は6.30:1 — 通常テキストでAAパス、黒背景では3.33:1 — 大きいテキストのみAAパスです。#9C27B0はUI要素・背景・テキスト・ボーダー・装飾アクセントなど多用途に活用できます。下のシェードセクションでは徐々に暗くなるバリエーションを、ティントストリップでは徐々に明るくなるバリエーションを確認でき、トーンパレットの構築に役立ちます。ハーモニースウォッチはHSL色相環に基づく補色・類似色・トライアドを提供します。
色をインタラクティブに確認したい、パレットを生成したい、カラー形式を変換したいですか？DevArborのカラーピッカーをご活用ください。
カラーピッカーを開く →よくある質問
#9C27B0のRGB値は何ですか？
#9C27B0（#9C27B0）のRGB値は rgb(156, 39, 176) です。Red・Green・Blueそれぞれの光の量を0〜255のスケールで表しています。
#9C27B0は白背景でアクセシブルですか？
#9C27B0と白（#FFFFFF）のコントラスト比は 6.30:1 — 通常テキストでAAパス です。黒（#000000）との比は 3.33:1 — 大きいテキストのみAAパス です。WCAG 2.1ではAA（通常テキスト）に4.5:1、AAAに7:1以上が必要とされています。
#9C27B0に合う色は何ですか？
カラー理論に基づくと、#9C27B0（hsl(291, 64%, 42%)）は補色・類似色・トライアドと相性がよいです。各ペアリングタイプの正確なHEX値は上のハーモニースウォッチを参照してください。