このツールの機能
水平・垂直オフセット、ぼかし半径、広がり、色、不透明度のスライダーを動かします。プレビューカードは即座に更新され、スタイルシートに貼れる正確なbox-shadow宣言が出力されます。insetをオンにすると内側の影になります。
ヒント
柔らかく低不透明度の影がモダンに見えます。大きなぼかしに10〜20%の黒を試してください。広がりは要素の縁を超えて影を拡大・縮小します。
プライバシー重視の設計
すべてはブラウザ内で実行されます。デバイスから出ることはありません。
ホーム › ボックスシャドウ生成ツール
プライベート：ブラウザから出ません。登録不要。
ボックスシャドウ生成ツール
スライダーで完璧なCSSシャドウを設計。無料、登録不要、コピー用コード付き。
プレビュー
あくまで目安です。表示の公表価格に基づいて計算しており、実際の請求額とは異なる場合があります。 利用規約
よくある質問
ぼかしと広がりの違いは？
ぼかしは影の輪郭を柔らかくします。広がりはぼかす前に影全体のサイズを拡大・縮小します。
insetとは？
影を要素の外側ではなく境界の内側に描画します。押し込んだような効果に便利です。
サーバーに送信されますか？
いいえ。エディタはすべてブラウザ内で動作します。