色コード変換

design tool間の色表記を揃える

hueは0〜360へnormalizeし、RGBは最終表示でinteger、HSLは読みやすい小数へroundします。

使い方

このツールを使う場面

確認できること

design toolやCSS間でHEX・RGB・HSL表記を揃えられます。

使う前に見るポイント

alphaなしの色か、各channelの入力範囲を確認します。

結果を見たあとにやること

round後のcodeとpreviewを元の色見本へ照合します。

つまずきやすいポイント

• alphaを含める

  初期版はopacityなしの3/6桁HEXです。

• 0〜1 RGBを入力

  RGB範囲は0〜255です。

境界値・事前チェック項目

• negative hue

  360°周期でnormalizeします。

• gray

  saturation 0ではhueを0で表示します。

よくあるミスと回避策

• %を数字欄へ含める

  S/Lは数値だけを入力します。

• 3桁HEXの展開

  #ABCは#AABBCCへnormalizeします。

FAQ

• hue 360は？

  0と同じ色へnormalizeします。

• 色入力はHTMLになりますか？

  いいえ。検証済みvalueだけをpreview styleに使います。

基本FAQ

• 入力データは外部へ送信されますか？

  原則として送信されません。入力内容はブラウザ内で処理し、URLやアクセス解析へ保存しません。例外がある場合は各ツールページ内に明記しています。

• 入力内容は自動保存されますか？

  原則として自動保存しません。ページを更新すると入力は失われます。コピーやダウンロードで保存する場合は、ご利用端末内に保存されます。

• 結果を使う前に何を確認すべきですか？

  対象年度・入力前提・提出先ルールを先に確認してください。必要に応じて公式情報や担当窓口で最終確認する運用を推奨します。

関連ツール

同じ作業の前後で使うことがあるツールです。