#CB202B

#CB202B

ファイアブリック系

カラーコード変換

形式
HEX#CB202B
RGBrgb(203, 32, 43)
RGBArgba(203, 32, 43, 1)
HSLhsl(356, 73%, 46%)
HSVhsv(356, 84%, 80%)
CMYKcmyk(0%, 84%, 79%, 20%)
Aa

白背景

5.55:1AA適合

Aa

黒背景

3.78:1AA Large


配色パレット提案

補色

色相環で180°反対に位置する色

#CB202B#20CBC0

類似色

色相環で隣接する色

#CB2081#CB2056#CB202B#CB3F20#CB6A20

トライアド

色相環で120°間隔の3色

#CB202B#2BCB20#202BCB

テトラード

色相環で90°間隔の4色

#CB202B#81CB20#20CBC0#6A20CB

モノクローム

同じ色相の明度バリエーション

#470B0F#89151D#CB202B#E4535D#EE959B

スプリットコンプリメンタリー

補色の両隣の色

#CB202B#20CB6A#2081CB

CSSグラデーションサンプル

ライト → ダーク

linear-gradient(135deg, #EB7F86, #CB202B, #5D0E14)

補色グラデーション

linear-gradient(135deg, #CB202B, #20CBC0)

類似色グラデーション

linear-gradient(135deg, #CB2081, #CB202B, #CB6A20)

ラジアルグロー

radial-gradient(circle, #CB202B, #5D0E14)

サンセット風

linear-gradient(to right, #CB202B, #CB6A20, #20CBC0)

オーバーレイ

linear-gradient(180deg, #CB202BCC, #CB202B33)

CSS使用例

背景色として使用

Hello, World!
background-color: #CB202B;

テキスト色として使用

Color Text
color: #CB202B;

ボーダー色として使用

ボーダー要素
border: 3px solid #CB202B;

シャドウとして使用

Shadow
box-shadow: 0 8px 32px #CB202B66;

関連するカラー