Liquid Glassジェネレーターは、AppleのLiquid Glass（液体ガラス）をWebGLで本物の屈折まで再現し、コピペできるコードを書き出す無料ツールです。背景画像の上にガラスのボタンやカードを置き、屈折・色収差・すりガラス・スペキュラをスライダーで調整できます。登録不要・透かしなし。
Liquid Glass（リキッドグラス／液体ガラス）は、Appleが2025年に発表しiOS 26・macOS Tahoeなどで採用された半透明のガラス素材表現です。背景を屈折（レンズのように歪ませる）させ、縁に鏡面ハイライトとわずかな色収差を載せ、全体をすりガラス状にぼかすのが特徴です。
多くのLiquid Glassジェネレーターは backdrop-filter とSVGフィルタによるCSS方式です。手軽ですが、背景を本当に屈折させることはできず、すりガラス＋ハイライトの平面的な表現にとどまります。本ツールはWebGL（GLSLシェーダー）で背景ピクセルをシェーダーで再サンプリングするため、縁のレンズ歪み・色収差まで実物に近づきます。
| 項目 | CSS方式（一般的なツール） | WebGL方式（本ツール） |
|---|---|---|
| 背景の屈折 | 不可（平面的なぼかしのみ） | 可（レンズのように歪む） |
| 色収差 | 擬似的 | RGBずらしで実物に近い |
| ページ背景への追従 | 追従する | 背景画像を焼き込む方式 |
| 出力 | CSS / HTML | 自己完結のWebGLスニペット |
はい。完全無料で、登録も透かしもありません。生成したコードはそのまま商用利用できます。
多くのツールは backdrop-filter とSVGフィルタによるCSS方式で、背景を本当に屈折させることはできません。本ツールはWebGL（GLSLシェーダー）で背景ピクセルを再サンプリングするため、レンズのような屈折と縁の色収差まで実物に近づきます。
いいえ。出力コードは背景画像をcanvasに焼き込む方式のため、その下にある任意のページ要素には追従しません。背景画像が決まっているヒーローやカードに向いています。
Chrome・Safari・EdgeなどWebGL対応ブラウザで屈折・色収差が表示されます。
はい。生成されたコードはあなたのものです。背景画像のURLをご自身の権利のある画像に差し替えてご利用ください。
Appleが2025年に発表したiOS 26・macOS Tahoeなどで採用された半透明のガラス素材表現です。背景を屈折させ、縁に鏡面ハイライトと色収差を載せ、全体をすりガラス状にぼかすのが特徴です。