人気のカラーコードガイド
よく使う形式から始めましょう。各ガイドでは、その形式が役立つ場面、値の仕組み、コピーや変換に使えるツールを説明します。
パレットをすばやく作成
ベースカラーを選んだら、カラーピッカー、色相環、パレット生成、コントラスト確認、ミキサーを使って実用的な Web パレットを作れます。
関連カラー ツール
このガイドで説明した色値を選択、変換、確認、書き出しするためのツールです。
その他のカラーガイド
HTML カラーコードHTML カラーコードの仕組みを学び、Hex、RGB、HSL、OKLCH、名前付き色、CSS 用の値をコピーできます。Hex カラーコードHex カラーコード、6 桁の #RRGGBB、短縮 Hex、Hex から RGB への変換ガイドです。RGB カラーコードRGB カラーコードを理解し、RGB を Hex に変換して CSS の rgb() 値を使います。HSL カラーコードHSL カラーコード、色相角、彩度、明度、CSS の hsl() の使い方を学びます。CSS カラーコードスタイルシート、グラデーション、枠線、影、SVG、UI デザインで CSS カラーコードを使います。カラーパレット生成ベースカラー、画像、色相環、ハーモニー、シェード、ティント、トーンからパレットを生成します。Web セーフカラーWeb セーフカラー、従来のブラウザー安全パレット、Hex 値、現代的な代替色を確認します。色の濃淡生成任意の Hex、RGB、HSL、OKLCH からシェード、ティント、トーン、バリエーションを作成します。