CSS box-shadow 生成

フロントエンド開発者向けの無料オンライン CSS box-shadow 生成ツールです。CSS の box-shadow プロパティは要素に1つ以上の影を付けます。各影は水平オフセット（offset-x）、垂直オフセット（offset-y）、ぼかし半径、広がり、色で定義されます。オプションの「inset」キーワードで内側の影にできます。スライダーとカラーピッカーでパラメータを視覚的に調整し、プレビューでリアルタイムに確認して、生成された CSS（例: box-shadow: 0 8px 24px 0 rgba(0,0,0,0.15);）をスタイルシートにコピーできます。インストール不要、すべてブラウザ内で動作します。

1. パラメータを調整：スライダーまたは数値入力でオフセット X（水平）、オフセット Y（垂直）、ぼかし、広がりを設定。カラーピッカーまたは HEX（例 #000000）で影の色、不透明度（0–1）を指定。「内側」にチェックで内側の影になります。

2. プレビュー：上のサンプルボックスはリアルタイムで更新されます。コピー前に効果を確認してください。

3. コードをコピー：満足したら「コードをコピー」をクリックして box-shadow の CSS をクリップボードにコピーし、CSS ファイルやインラインスタイルに貼り付けてください。