#F99358

#F99358

サンディブラウン系

カラーコード変換

形式
HEX#F99358
RGBrgb(249, 147, 88)
RGBArgba(249, 147, 88, 1)
HSLhsl(22, 93%, 66%)
HSVhsv(22, 65%, 98%)
CMYKcmyk(0%, 41%, 65%, 2%)
Aa

白背景

2.25:1不適合

Aa

黒背景

9.34:1AA適合


配色パレット提案

補色

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

#F99358#58BEF9

類似色

色相環で隣接する色

#F9586D#F96A58#F99358#F9BB58#F9E358

トライアド

色相環で120°間隔の3色

#F99358#58F993#9358F9

テトラード

色相環で90°間隔の4色

#F99358#6DF958#58BEF9#E358F9

モノクローム

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

#B14506#F6630E#F99358#FCC3A1#FEF2EB

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

補色の両隣の色

#F99358#58F9E3#586DF9

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

ライト → ダーク

linear-gradient(135deg, #FDE2D3, #F99358, #CA4F07)

補色グラデーション

linear-gradient(135deg, #F99358, #58BEF9)

類似色グラデーション

linear-gradient(135deg, #F9586D, #F99358, #F9E358)

ラジアルグロー

radial-gradient(circle, #F99358, #CA4F07)

サンセット風

linear-gradient(to right, #F99358, #F9E358, #58BEF9)

オーバーレイ

linear-gradient(180deg, #F99358CC, #F9935833)

CSS使用例

背景色として使用

Hello, World!
background-color: #F99358;

テキスト色として使用

Color Text
color: #F99358;

ボーダー色として使用

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

シャドウとして使用

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

関連するカラー