Style · グラスモーフィズム
グラスモーフィズムなWebデザインのAIプロンプト集
半透明のすりガラス風パネルを重ねるグラスモーフィズム系AIプロンプト集。iOS/macOS風のモダンUI。
グラスモーフィズムについて
グラスモーフィズムは半透明のすりガラス風パネルを重ねる表現。macOS Big Sur、Windows 11、iOS 16で主流化したスタイルで、`backdrop-filter: blur()`と薄い境界線、浮遊感のある影で実現します。背景に彩度の高いカラフルなレイヤーが必要。
よく使われる場面
- モダンなSaaSのランディングページ
- モバイルアプリのUI
- クリエイティブツール
- 音楽・メディアプレイヤー
- 個性を出したい個人ポートフォリオ
成功のポイント
- backdrop-filter: blur() を20-30pxで
- 背景に鮮やかな色を置いてガラス感を出す
- 境界線は白の透過1-2pxでふちどる
- 影は薄く、2層に分ける(近+遠)
- Safari/Firefoxのフォールバックを用意