ウェブセーフカラーパレット
定番の 216 のウェブセーフカラーをクリック可能なスウォッチグリッドで閲覧 — 色相またはキューブ順で並べ替え、hex でフィルターし、任意の HEX や rgb() 値を即座にコピーできます。
HEX
RGB
最も近い色
その hex に一致するウェブセーフカラーはありません。
216 のウェブセーフカラーは、各 RGB チャンネルにおける 00、33、66、99、CC、FF の各レベルのすべての組み合わせです。すべてブラウザ内で実行され、アップロードも登録も不要で、完全に無料です。
ウェブセーフカラーパレットについて
Webセーフカラーパレットは、6つのRGBチャンネルレベル00、33、66、99、CC、FFから構築された216色の古典的なセットです。これは初期のディスプレイがディザリングなしで描画できた6×6×6のカラーキューブです。このツールはすべての216スウォッチを1つのクリック可能なグリッドに配置し、数秒でスキャン、比較、値の取得ができます。
パレットは元のキューブ順で表示することも、色相順に並べ替えることもできます。並べ替えるとグレーが最初に来て、その後スペクトルをたどります。HEXフィルターボックスに入力すると、その場でグリッドが絞り込まれます。例えば33CCと入力すると、その数字で始まるスウォッチにすぐジャンプします。
スウォッチをクリックすると、そのHEXコードが即座にコピーされ、一致するrgb()の値と最も近いネームドCSSカラーを表示する詳細パネルが開きます。それぞれに独自のコピーボタンがあります。すべてブラウザ内で計算されるため、レトロなパレット、メールセーフな色、制約のあるデザインシステムの手早い参考資料として使えます。
ウェブセーフカラーパレットの使い方
- ツールを開くと、デフォルトでキューブ順にソートされた216のWebセーフカラーすべてがスウォッチグリッドとして表示されます。
- グレーを先に、その後スペクトルに沿ってグループ化された色を見たい場合は、並び順を「色相順」に切り替えます。
- HEXフィルターボックスに(例えば33CC99のように)入力して、そのHEXコードで始まるスウォッチにグリッドを絞り込みます。
- 任意のスウォッチをクリックします――そのHEX値がすぐにクリップボードにコピーされ、グリッドの下に詳細パネルが開きます。
- 詳細パネルのコピーボタンを使って、HEXコード、rgb()の値、または最も近いネームドCSSカラーを取得します。
よくある質問
赤、緑、青の各チャンネルで00、33、66、99、CC、FFの値を組み合わせて作られる216色です。この6×6×6のキューブは、8ビットディスプレイがディザリングなしで一貫して表示できたパレットでした。
現代の画面は何百万もの色を表示できるため、この制約は歴史的なものです。それでもこのパレットは、レトロなデザイン、ピクセルアート、クイックプロトタイプ、制約のあるブランドやメールのパレットに向いた、コンパクトで均等に配置されたカラーセットとして便利です。
選択した各スウォッチは、コピー可能な3つの値を提供します。HEXコード(#33CC99など)、対応するrgb()表記、そしてRGB距離で計算された最も近いネームドCSSカラーです。グリッド内のスウォッチをクリックすると、そのHEXも即座にコピーされます。
ツールは選択したスウォッチを標準CSSカラー名の組み込みリストと比較し、RGB距離で最も近いマッチを返します。マッチが完全でない場合は、≈記号で近似としてマークされます。
はい。216色すべてのグリッド、色相順のソート、HEXフィルター、すべてのコピー操作は無料で、登録も不要です。パレットは完全にブラウザ内で生成・ソートされ、サーバーへのリクエストは一切ありません。
お困りですか？
このツールで問題が見つかりましたか？チームにお知らせください。