カラーコード変換（HEX・RGB・HSL）

カラーコード変換ツールの使い方

HEXカラーコードを入力するか、カラーピッカーで色を選ぶと、RGB・HSLが即座に計算されます。 各フォーマットのコピーボタンでCSSファイルにそのまま貼り付けられます。 RGB・HSL側の数値を直接変更することも可能です。

HEX・RGB・HSLの使い分け

HTMLやCSSで色を指定するならHEXが最もシンプルです。 透明度（alpha）が必要な場合はrgba()、 色の明暗を動的に変えたい場合はhsl()が便利です。 Tailwind CSSなどのフレームワークでは独自カラーをHEXで設定することが一般的です。

日本の伝統色について

山吹色・萌葱色・藍色など、日本の文化に由来する伝統色20色のカラーコードを収録しています。 和風デザイン・ブランドカラーの参考にご活用ください。 各スウォッチをクリックすると即座にHEX/RGB/HSLが更新されます。

関連ツール：カラーパレット生成・コントラストチェッカー