CSS box-shadowジェネレーター
ライブプレビュー付きでCSSの影（box-shadow）を作成：オフセット、ぼかし、広がり、色、不透明度、複数のレイヤー、用意されたテンプレート。
使い方CSSの影ジェネレーター
利用できる言語: 
広告
CSS box-shadowジェネレーター: 用途
影のオフセット、ぼかし、広がり、色、不透明度を調整して、結果をすぐに確認できます。複数のレイヤーを組み合わせてリアルな影を作り、内側（inset）オプションも使えます。
やわらか・重ね、Material、浮遊、輪郭、ニューモフィズム、ネオンなどのテンプレートが用意されています。CSSコードはborder-radius付きで、そのままコピーできます。
使い方
- テンプレートを選ぶか、ゼロから始めます。
- レイヤーと色を調整します。
- CSSをコピーします。
使うタイミング
- カードやボタンに奥行きを与える。
- ニューモフィズムやネオンの効果を作る。
- box-shadowの仕組みを学ぶ。
よくある質問
やわらかくリアルな影はどう作りますか？
不透明度の低い複数のレイヤーを使います。短くくっきりしたものと、長くぼかしたものです。「やわらか・重ね」テンプレートがすでにそうなっています。
内側の影（inset）とは何ですか？
要素の内側に描かれる影で、要素がへこんでいるように見えます。レイヤーの「内側」オプションにチェックを入れてください。
本当に無料？
はい、100%無料です。登録不要、サブスクなし、利用制限なし。すべてのツール：Tools123は無料です。