DevToolBox

Box Shadow ジェネレーター

CSSのbox-shadowを視覚的に作成。複数のシャドウレイヤーにも対応。

プレビュー

CSS出力

CSS
box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.1);

シャドウ設定

シャドウ 1

使い方

スライダーを動かしてリアルタイムでbox-shadowをプレビューできます。 複数のシャドウを重ねることも可能。CSSコードをコピーしてそのまま使えます。