HEXからRGBAへの変換ツール

API reference

HEXカラー（#RGB、#RGBA、#RRGGBB、#RRGGBBAA）をCSSのrgba()/rgb()形式に変換し、赤・緑・青・アルファ・HSLAの内訳を表示します。アルファ値の上書きも任意で行えます。

入力

HEXカラー

3桁・4桁・6桁・8桁の16進数に対応しています。先頭の#はあってもなくても構いません。4桁と8桁の形式にはアルファ（透明度）チャンネルが含まれます。

アルファ値の上書き

任意。0（透明）から1（不透明）までの値を指定します。HEXに含まれるアルファ値より優先されます。

出力

RGBA

カラー値

項目	値
No data yet

役に立ちましたか？

このツールを使う他の方法

REST API

curl -X POST https://api.iotools.cloud/v1/tool/hex-to-rgba-converter \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "hex": "#FF0000",
    "alphaOverride": ""
  }'

ご自身のアカウントのキーに差し替えてください。ツールのフィールドがそのままリクエストボディになります——ラッパーはありません。

AIエージェントに依頼する

Use the IOTools `hex-to-rgba-converter` tool (HEX to RGBA Converter) on this input:

YOUR_INPUT_HERE

IOTools MCPサーバーに接続された任意のエージェントにこれを貼り付け、入力内容を追加してください。

埋め込みウィジェット

<iframe
  src="https://iotools.cloud/embed/hex-to-rgba-converter/"
  width="100%" height="520" frameborder="0" scrolling="no" loading="lazy"
  title="HEXからRGBAへの変換ツール — iotools.cloud"
  sandbox="allow-scripts allow-forms allow-same-origin allow-downloads allow-popups allow-popups-to-escape-sandbox"
  allow="clipboard-write"
  style="width:100%;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden"></iframe>
<script src="https://iotools.cloud/embed.js" async></script>

ご自身のページに貼り付けるだけ——無料、キー不要、リンクを掲載するだけです。

API/MCP 1回あたりの費用	5クレジットから
クレジットが足りませんか?	料金を見る

次の方法でも利用可能

統合ブラウザ拡張機能 VS Code拡張機能

ガイド

HEXカラーコードを、ワンステップでCSSの rgba()（および rgb()）形式に変換できます。16進数の値を貼り付けるだけで、赤・緑・青・アルファの各成分に分解され、そのままスタイルシートに使えます。処理はすべてお使いのブラウザ内で行われるため、色のデータが端末の外に送信されることはありません。

使い方

HEXカラー欄に16進数の色を入力または貼り付けます。
変換された rgba() の文字列を確認するか、ワンクリックでコピーします。
カラー値の表で、R・G・B・アルファの個別の数値と、同等の rgb() および hsla() 表記を確認します。

先頭の # は省略できます。#FF0000 と FF0000 のどちらでも動作します。

どの16進数形式に対応していますか？

CSSで標準的な16進数の形式はすべて受け付けます。

#RGB — 3桁の短縮形。各桁が2倍になるため、#F00 は #FF0000 → rgba(255, 0, 0, 1) になります。
#RGBA — アルファ桁を含む4桁の短縮形。
#RRGGBB — 一般的な6桁の形式。
#RRGGBBAA — 8桁の形式で、末尾の2桁がアルファチャンネルを表します。

16進数にアルファチャンネルが含まれていない場合は、完全に不透明な色（アルファ 1）として扱われます。

アルファ値はどのように変換されますか？

8桁の16進数では、アルファは 00 から FF（0〜255）のバイト値として保存されています。CSSの rgba() は0〜1の小数を求めるため、そのバイト値を255で割ります。たとえば 80 は128で、128 ÷ 255 = 0.502 になります。値は小数点以下3桁で保持されており、この精度があれば8ビットの各アルファ段階が元のバイト値に正確に戻ります。小数点以下2桁で丸める簡易的な変換ツールでよく起きる「1つずれる」誤差を防ぐためです。

透明度を自分で指定できますか？

はい。任意項目の アルファ値の上書き に、0（完全に透明）から 1（完全に不透明）までの値を指定できます。たとえば #336699 のような不透明なブランドカラーを50%の半透明にしたい場合は、上書きに 0.5 を入力すると rgba(51, 102, 153, 0.5) が得られます。上書きの値は、16進数に含まれているアルファ値よりも優先されます。

RGBとRGBAの違い

単色だけが必要な場合は、結果の表にある rgb() の行を使ってください。rgba() の出力には常にアルファチャンネルが含まれており、これはオーバーレイ、シャドウ、ホバー時の状態変化、グラスモーフィズムなどの効果に必要なものです。

入力したデータは安全ですか？

はい。変換はブラウザ内で単純な計算によって行われ、データがサーバーにアップロードされることはありません。

colorhexrgbargbcssalphaconverter

ツールが気に入りましたか？広告をなくしましょう。

1回のお支払いでアカウントから広告が完全になくなります。サブスクリプションも追跡もありません。

広告を削除