メインコンテンツへ移動
ToolShed
検索
⌘
K
人気
新着ツール
?
読み込み中...
🏠
探す
☰
カテゴリ
🔥
人気
?
について
ホーム
/
カラー
/
HTMLカラー名一覧
◉
HTMLカラー名一覧
color/html-color-names
aliceblueからhotpinkまで54行のHTML/CSS色名とHEXを、テキスト欄で絞り込み表示します。
最終更新日
2026-07-03
・ by
yuzlrin
このツールでできること
HTMLカラー名一覧では、aliceblueからhotpinkまで54行のHTML/CSS色名とHEXを、テキスト欄で絞り込み表示します。
関連する観点として HTMLカラー名、CSS色名、color names を確認し、結果をコピーして別の作業に使えます。
絞り込み
結果
aliceblue #F0F8FF antiquewhite #FAEBD7 aqua #00FFFF aquamarine #7FFFD4 azure #F0FFFF beige #F5F5DC bisque #FFE4C4 black #000000 blanchedalmond #FFEBCD blue #0000FF blueviolet #8A2BE2 brown #A52A2A burlywood #DEB887 cadetblue #5F9EA0 chartreuse #7FFF00 chocolate #D2691E coral #FF7F50 cornflowerblue #6495ED cornsilk #FFF8DC crimson #DC143C cyan #00FFFF darkblue #00008B darkcyan #008B8B darkgoldenrod #B8860B darkgray #A9A9A9 darkgreen #006400 darkhaki #BDB76B darkmagenta #8B008B darkolivegreen #556B2F darkorange #FF8C00 darkorchid #9932CC darkred #8B0000 darksalmon #E9967A darkseagreen #8FBC8F darkslateblue #483D8B darkslategray #2F4F4F darkturquoise #00CED1 darkviolet #9400D3 deeppink #FF1493 deepskyblue #00BFFF dimgray #696969 dodgerblue #1E90FF firebrick #B22222 floralwhite #FFFAF0 forestgreen #228B22 fuchsia #FF00FF gainsboro #DCDCDC gold #FFD700 goldenrod #DAA520 gray #808080 green #008000 greenyellow #ADFF2F honeydew #F0FFF0 hotpink #FF69B4
コピー
使い方
絞り込み欄を空のままにすると、収録されている54行がまとめて表示されます。
「dark」や「blue」のような英字を入力し、該当する名前またはHEXを含む行だけに絞ります。
結果欄のテキストを確認し、Copy ボタンで表示中の一覧をコピーします。
CSS全色の確認が必要な場合は、収録範囲が異なる関連ツールや仕様表と照合します。
入力例・出力例
INPUT
hotpink
OUTPUT
hotpink #FF69B4
node検算済み。収録範囲の最後にある1行です。
INPUT
dark
OUTPUT
darkblue #00008B ...(17行) darkviolet #9400D3
darkを含む17行に絞り込まれます。
INPUT
rebecca
OUTPUT
該当なし
rebeccapurpleはこの固定文字列に含まれていません。
よくある利用シーン
aliceblue、cornflowerblue、hotpinkなど前半に並ぶHTML色名のHEXを確認したいとき。
英字の一部で固定リストを絞り込み、候補行をまとめてコピーしたいとき。
全CSS色名表ではなく、実装にある小さな参照リストとして扱いたいとき。
結果確認のポイント
色空間、透明度、コントラスト、コピーしたコード形式が用途に合うか確認してください。
HTMLカラー名、CSS色名、color namesの観点で、入力内容と出力内容がずれていないか見直してください。
コピーした結果を利用先に貼り付けたあと、改行や記号が変わっていないかも確認してください。
注意点
画面やOSの色管理により見え方が変わるため、最終判断は実機でも確認してください。
結果を公開・送信する前に、用途に合う形式かを必ず確認してください。
データの扱い / プライバシー
HTMLカラー名一覧の主要な処理はブラウザ内で実行されます。
入力内容を保存するアカウント機能はなく、ページを閉じると作業内容は手元のブラウザから離れます。
本番の秘密情報や個人情報を扱う場合は、入力前に必要性を確認してください。
FAQ
よくある
質問
HTML/CSSのカラー名を全件確認できますか?
いいえ。このツールはaliceblueからhotpinkまでの54行だけを固定テキストで表示し、入力語で行を絞り込む実装です。CSS名前付き色の全147/148色や色見本付き一覧ではありません。
カラー名とHEXコードはどう対応していますか?
たとえば red=#FF0000、lime=#00FF00(green は #008000)、navy=#000080 のように、名前に対して1つのHEXコードが定義されています。同じ色に複数の名前が存在するケース(aqua=#00FFFF と cyan=#00FFFF)もあります。
CSSで色名を使うことの注意点は?
色名は可読性が高い反面、チーム開発やデザインシステムでは HEX や CSS変数のほうが管理しやすい場合があります。また gray と grey のように綴りが複数ある色名は、ブラウザによって同一の色にマッピングされています。
関連ツール
カラーシェード生成
指定色の明暗バリエーション(10段階)を自動生成。
アクセシブルカラー生成
前景色・背景色をHEXで指定するとWCAG 2.1のコントラスト比を自動計算。通常テキスト(AA 4.5:1/AAA 7:1)と大きい文字(AA 3:1/AAA 4.5:1)それぞれの合否をバッジで表示し、プレビュー文で実際の見え方も確認できます。
ANSIカラー一覧
ANSIエスケープシーケンスの文字色コード(標準8色 SGR 30〜37、高輝度8色 90〜97)と背景色コード(40〜47、100〜107)を色名・番号・エスケープシーケンスの対応表で確認できるツール。ターミナル配色の把握やシェルスクリプトの色指定に。
ブランドカラー一覧
主要ブランド名と代表的なHEXカラー値を2列の固定表で確認できる。
CMYK→HEX変換
CMYKカラー値をHEXに変換する。
コントラスト比早見表
WCAGでよく使う1:1、3:1、4.5:1、7:1、21:1の意味を固定表で確認できる。
WCAG AA 白背景
入力HEX色を白背景と比較し、通常テキストと大テキストのWCAG AA到達可否を表示する。
HEX #追加
改行区切りの各行について、#が無いHEX表記の先頭に#を付ける単純変換。