Entering AttentionFlow

🎨

HTMLカラーピッカー

HSL/RGB/HEX対応の高度なHTMLカラーピッカー。

カラーピッカーとは?

Web製作やデザインで使用する色を自由に作成・変換できるツールです。400色のカラーマトリックスや、視覚的なパレットを使って直感的に色を調整し、HEXやRGBコードをすぐに取得できます。

Benefits

  • 400色のマトリックスと自由度の高いHSL/RGBパレットを搭載しています
  • コントラスト分析機能で、文字の読みやすさを事前にチェックできます
  • HEX、RGB、HSLなど、代表的なカラーフォーマットを網羅しています
  • プリセットとして用意されたブランドカラーから着想を得ることもできます

使い方は?

1. カラーマトリックスから好みの色を選ぶか、パレットで微調整します。
2. 必要に応じて。不透明度や出力形式(HEX/RGBなど)を切り替えます。
3. 色が決まったら、表示されているコードをクリックしてコピーします。
4. 「コントラスト分析」を使って、背景色とのバランスも確認してみましょう。
ビジュアルパレット
217°
100%
カラーマトリックス (400色)
左右にスワイプしてすべての色を表示
カラー変換
クイックコピー
フォーマット
ブランドカラー
Google
Netflix
Yahoo
iOS
Android
Facebook
Twitter
コントラスト分析

現在の色に対して推奨される 5 つの高コントラストなテキスト色:

#000000Ratio: 5.7:1
#1E293BRatio: 4.0:1
#FFFFFFRatio: 3.7:1
#F8FAFCRatio: 3.5:1
#A3E635Ratio: 2.4:1
サンプルテキスト over #3B82F5 (5.7:1)
サンプルテキスト over #3B82F5 (4.0:1)
サンプルテキスト over #3B82F5 (3.7:1)
サンプルテキスト over #3B82F5 (3.5:1)
サンプルテキスト over #3B82F5 (2.4:1)
フォーマットコンバーター

提供される色数値は参考用であり、実際の表示はモニターのキャリブレーションによって異なる場合があります。

他の便利なツールを探索