カラーコードをHEX・RGB・HSL・HSV・CMYK の相互変換ができます。デザインツールとCSSで表記が違うときの橋渡しに。あわせて明度違いのカラーバリエーションも自動生成するので、ホバー色や背景色を決めるときにもどうぞ。
🔒 この処理はブラウザの中だけで完結します
- 入力した色はサーバーに送信されません。計算はすべてお使いのブラウザの中で行っています。
CMYKについて
表示しているCMYK値は簡易的な計算による目安です。実際の印刷物では、使用する用紙・インキ・プロファイル（Japan Color 2001 Coatedなど）によって色が変わります。印刷データを作る場合は、必ずIllustratorやPhotoshopのカラー設定で変換してください。画面の色（RGB）は印刷（CMYK）では再現できない範囲があり、特に鮮やかな青や緑はくすみます。
表示しているCMYK値は簡易的な計算による目安です。実際の印刷物では、使用する用紙・インキ・プロファイル（Japan Color 2001 Coatedなど）によって色が変わります。印刷データを作る場合は、必ずIllustratorやPhotoshopのカラー設定で変換してください。画面の色（RGB）は印刷（CMYK）では再現できない範囲があり、特に鮮やかな青や緑はくすみます。
HSLとHSVの違いは何ですか？
どちらも「色相・彩度・明るさ」で色を表しますが、3つ目の意味が違います。HSLのL（輝度）は50%が最も鮮やかで、100%にすると白、0%で黒になります。HSVのV（明度）は100%が最も明るい状態で、下げると黒に近づきます。CSSが対応しているのはHSLで、PhotoshopなどのデザインツールはHSVを使うことが多いです。
ホバー色はどう決めればいいですか？
色相と彩度は変えずに明度だけを10〜15%動かすのが基本です。下に出しているカラーバリエーションがちょうどその考え方で作られています。明るい背景色のボタンなら暗く、暗いボタンなら明るくすると自然です。なお、文字色との組み合わせはカラーコントラスト判定で確認してください。
透明度（アルファ値）はどう書きますか？
CSSでは rgba(23, 105, 211, 0.5) のほか、HEXに2桁足した8桁表記（#1769d380）も主要ブラウザで使えます。このツールでも8桁HEXを出力しているので、そのままコピーできます。8桁HEXや rgba()・hsla() で透明度つきの色を入力すると、その透明度を引き継いで各形式に変換します（HSV・CMYKには透明度の表し方が無いため、色だけを出します）。なお 80 は16進数で50%（128/255）という意味です。
🔒 調べた内容は記録・公開しません
- 検索した内容を保存・一覧化・公開しません。調査結果をデータベース化して検索できるようにしたり、他の利用者に見せたりすることは一切ありません。
- 検索履歴を残しません。誰が何を調べたかを紐づけて蓄積することはしません。会員登録・ログインも不要です。
- 第三者に提供・販売しません。営業リストや広告目的での利用もありません。
- サーバー負荷を抑えるため、判定結果のみ最大1時間の一時キャッシュに保持し、時間の経過で自動的に消えます。連続アクセスの制限用にIPアドレスをハッシュ化した値を最大10分間だけ保持します（元のIPアドレスは保存しません）。
- 調べた対象は共有用にURLの
#以降に付きますが、この部分はサーバーにもアクセス解析にも送信されません。
同じ分類のツール（制作の道具（ブラウザ内で完結））
アクセス情報チェックあなたのIPアドレス・ブラウザ・OSなど、サーバーに送られている情報を表示します。IP制限の設定に。URLエンコード・デコード日本語URLをパーセントエンコーディングに変換、またはその逆に戻します。複数行まとめて処理できます。HTML特殊文字変換HTMLやコードをページに載せるための実体参照変換。逆方向にも対応しています。カラーコード変換（表示中）HEX・RGB・HSL・HSV・CMYKを相互変換し、明度違いのバリエーションも自動生成します。パスワード生成推測されにくいランダムなパスワードを生成します。強度と解読にかかる時間の目安も表示します。.htpasswd 生成（ベーシック認証）ベーシック認証に必要な .htpasswd と .htaccess の記述を作ります。公開前のサイトを隠すときに。Excel表 → HTMLテーブル変換ExcelやスプレッドシートからコピーしてHTMLテーブルに変換します。Markdown表にも対応。.htaccessリダイレクト生成旧URLと新URLの対応表から301リダイレクトの記述を生成します。www統一や常時SSL化の定番も。ファビコン一式生成画像1枚から favicon.ico・各サイズPNG・manifest・HTMLの記述までまとめて作ります。OGP画像ジェネレータータイトルを入れるだけで、SNSシェア用の1200×630px画像をその場で作ります。画像のWebP変換・リサイズ画像をまとめてWebPに変換・リサイズし、前後のファイルサイズを比較できます。カラーコントラスト判定文字色と背景色のコントラスト比とWCAG判定。基準を満たす色も自動で提案します。
運営：WEBツール箱（MOTOKI合同会社）
WordPress専門のホームページ制作会社です。日々の制作で「毎回調べるのが面倒だった」ことを、そのままツールにして公開しています。
診断結果の見方や改善のご相談も承っています。お問い合わせ
WordPress専門のホームページ制作会社です。日々の制作で「毎回調べるのが面倒だった」ことを、そのままツールにして公開しています。
診断結果の見方や改善のご相談も承っています。お問い合わせ