N's Webtools
ホーム
🔳

CSS Box Shadowジェネレータ

CSSのbox-shadowをビジュアルに作成

使い方

スライダーで各パラメータを調整すると、プレビューとCSSコードがリアルタイムで更新されます。

  • Offset/Blur/Spread/色/透明度の調整
  • 複数シャドウの重ね掛け
  • Insetシャドウ対応
  • リアルタイムプレビュー

こんなときに使おう

  • カードやボタンに影をつけたいとき
  • 複数のシャドウを重ねたデザインを作りたいとき
  • box-shadowのCSSコードを素早く生成したいとき

シェア

関連ツール