STYLE PROFILE

ガラス／リフラクション

Glass and Refraction

透明な物体の透けや屈折、表面の反射を使う表現です。背後の形が曲がって見える様子や、厚みによる色の変化で透明体の存在を見せます。

見本はこの図鑑のためにAIで生成した画像です。

ガラス／リフラクションの代表配色例

色コードと役割をまとめてコピーできます。

背景（`#132435`）とのコントラスト比
色	役割	比	文字に使う目安
`#F1F6F8`	文字と構造	14.47:1	本文の文字にも使える
`#87B4C5`	主色	7.03:1	本文の文字にも使える
`#426F89`	強調色	2.90:1	文字には向かない

比はWCAG 2.2の計算式で求めた値です。4.5:1以上は本文の文字、3:1以上は大きな文字や図形に使える目安です（達成基準1.4.3・1.4.11）。

ガラス／リフラクションのプロンプト例

ガラス／リフラクションでデザインしてください。背後が見える透明な面、屈折によって曲がる背後の像、表面の反射と厚みによる色の変化を取り入れてください。

ガラス／リフラクションの主な視覚的特徴

背後が見える透明な面
光が物体の内部を通り抜けるため、背後の形や色が見えます。完全に透明な薄いガラスでも、表面の反射によって存在が分かります。
屈折によって曲がる背後の像
光は屈折率の異なる物質の境目で向きを変えるため、透明体を通った背後の像は曲がったりずれたりします。水槽の魚が2か所に見えるのも同じ仕組みです。
表面の反射と厚みによる色の変化
表面には周りが映り込み、内部では光が進むほど吸収されて弱まります。そのため色付きのガラスでは、厚い部分ほど色が濃く見えます。

ガラス／リフラクションが向いている成果物

透明体を通して背景が曲がる様子を主題にし、光や透け感を感じる印象的な一枚を作れる。説明文字は屈折させず別に配置する。

ガラス／リフラクションとは

ガラス／リフラクションは、透明な物体の透けや屈折、表面の反射によって、その存在を見せる表現です。屈折とは、屈折率の異なる物質の間を光が通るとき、光線の向きが変わる（曲がる）ことです。水槽をのぞくと同じ魚が2か所に見えることがあるのも、水から空気へ出る光が向きを変えるためです。屈折の法則はスネルの法則と呼ばれ、オランダの数学者スネルが1621年に見いだしましたが、984年にはイブン・サフルが見つけていました。

3DCGの形式glTFの基本の材質は、透明さを「アルファ（被覆率）」としてしか扱えず、ガラスやプラスチックには別の描き方が必要でした。そこで2020年10月に透過の拡張が加わり、完全に透明な薄いガラスでも、表面の反射によって見えるように描けるようになりました。2021年5月には体積と屈折率の拡張が加わり、厚みのある物体の中での屈折と吸収を扱えるようになりました。基本の材質の屈折率は1.5に固定されており、多くのプラスチックやガラスに合う値です。

2025年6月、アップルは周囲を反射し屈折させる半透明の素材「Liquid Glass」を使った新しいソフトウェアデザインを発表しました。iPadOSとmacOSのサイドバーは背後のコンテンツを屈折させ、周りのコンテンツや壁紙を映し込みます。

見分けるときは、次の点を確かめてみてください。