タスクの道筋 / 入力から結果へ
HEX カラーを RGBA に変換する方法
- 01
HEX カラーを入力する
「HEX カラー」フィールドに値を入力します。最初は #6D5EF8CC が入力された状態で開きます。厳密なパーサーは #RGB、#RGBA、#RRGGBB、#RRGGBBAA を受け付けます。フィールド下のヘルパーに挙げられているのはまさにこの 4 形式で、入力は 9 文字までに制限されています。
- 02
変換を実行する
「RGBA に変換」を押します。パーサーはレンダリング前に値全体を検証し、不正な値は受け付けられる 4 形式を示すメッセージとともに拒否されます。フィールドを編集すると前の結果がクリアされるので、下のパネルに古い色が表示されたままになることはありません。
- 03
RGBA チャンネルを確認する
Alpha はバイトを 255 で割り、計算中は丸めません。RGBA とチャンネル表示は小数点以下最大 6 桁で、全 256 種の alpha バイトを出力 RGBA から復元できます。
- 04
スウォッチを確認する
大きなプレビュースウォッチが変換後の色をそのままレンダリングするので、半透明の結果もページ上ですぐに見た目がわかります。コピーする前に、アルファがデザインの意図どおりに読めるかを確認するのに使ってください。
- 05
必要ならサンプルを読み込む
「サンプルを読み込む」を押すと、完全な変換例（#22C55E99 が rgba(34, 197, 94, 0.6) に変換されます）が実行され、入力からチャンネルまでの全体的な流れを確認できます。「リセット」でフィールドが #6D5EF8CC に戻り、結果がクリアされます。
- 06
結果をコピーまたはダウンロードする
「出力をコピー」で rgba() の値をクリップボードにコピーするか、「ダウンロード」で toolars-color-rgba.txt として保存します。どちらの操作も変換が成功するまで無効なので、空の結果をコピーしてしまうことはありません。