CSS Box Shadow ジェネレーター
CSS Box Shadow とは？
CSS の box-shadow プロパティは、要素のフレーム周囲にシャドウ効果を追加します。シャドウはオフセット、ぼかし、広がり、色付け、inset（内側シャドウ）として設定できます。カンマ区切りの複数シャドウを重ねることで、豊かな表現が可能です。このジェネレーターでは、複雑な多層シャドウをビジュアルで構築し、貼り付け可能なCSSをクリップボードにコピーできます。
Box Shadow ジェネレーターの使い方
-
Offset X/Y・Blur・Spread のスライダーを調整して、シャドウの位置と形を整えます。
-
カラーサンプルをクリックしてシャドウの色を選び、Opacity スライダーで透明度を設定します。
-
「内側」をオンにすると、内側グロー効果や押し込まれた効果が作れます。
-
「+ レイヤーを追加」をクリックして、複数のシャドウを重ねます。
-
生成されたCSSをコピーして、スタイルシートに貼り付けます。
Keywords: CSS box shadow ジェネレーター, box-shadow CSS, CSS シャドウツール, CSS ドロップシャドウ, 内側シャドウ, 多層シャドウ, CSS shadow オンライン