#500EF6

#500EF6

ブルー系

カラーコード変換

形式
HEX#500EF6
RGBrgb(80, 14, 246)
RGBArgba(80, 14, 246, 1)
HSLhsl(257, 93%, 51%)
HSVhsv(257, 94%, 96%)
CMYKcmyk(67%, 94%, 0%, 4%)
Aa

白背景

7.68:1AA適合

Aa

黒背景

2.73:1不適合


配色パレット提案

補色

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

#500EF6#B4F60E

類似色

色相環で隣接する色

#0E40F6#160EF6#500EF6#8A0EF6#C40EF6

トライアド

色相環で120°間隔の3色

#500EF6#F6500E#0EF650

テトラード

色相環で90°間隔の4色

#500EF6#F60E40#B4F60E#0EF6C4

モノクローム

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

#200467#3706B1#500EF6#8558F9#BBA1FC

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

補色の両隣の色

#500EF6#F6C40E#40F60E

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

ライト → ダーク

linear-gradient(135deg, #A989FB, #500EF6, #280580)

補色グラデーション

linear-gradient(135deg, #500EF6, #B4F60E)

類似色グラデーション

linear-gradient(135deg, #0E40F6, #500EF6, #C40EF6)

ラジアルグロー

radial-gradient(circle, #500EF6, #280580)

サンセット風

linear-gradient(to right, #500EF6, #C40EF6, #B4F60E)

オーバーレイ

linear-gradient(180deg, #500EF6CC, #500EF633)

CSS使用例

背景色として使用

Hello, World!
background-color: #500EF6;

テキスト色として使用

Color Text
color: #500EF6;

ボーダー色として使用

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

シャドウとして使用

Shadow
box-shadow: 0 8px 32px #500EF666;

関連するカラー