← すべてのテキストツール

CSSボックスシャドウジェネレーター

スライダーとリアルタイムプレビューでボックスシャドウをデザインし、CSSをコピーできます。

  • 無料
  • 登録不要
  • どの端末でも使える

約CSSボックスシャドウジェネレーター

ライブプレビューでオフセット、ぼかし、スプレッド、色、不透明度を調整し、box-shadowの宣言をコピーできます。値は、xオフセット、yオフセット、ぼかし半径、スプレッド半径、色の順です。insetを付けるとボックスの内側に影が描かれ、自然に見せるには不透明度を低くしてください。

CSSボックスシャドウジェネレーターの使い方

  1. 上でオプションを設定します。結果はリアルタイムで更新されます。
  2. 納得がいくまで自由に調整します。
  3. 結果をコピーするか、ダウンロードします。

このツールを使う理由

別名

よくある質問

box-shadowのスプレッド値は何をしますか?

スプレッドは、ぼかしが適用される前に影を拡大または縮小します。正の値ではボックスより大きく、負の値では小さくなり、片側だけの影に便利です。

CSSボックスシャドウジェネレーターは無料ですか?

はい。ToolipediaのCSSボックスシャドウジェネレーターは無料で、登録不要、透かしもありません。

安全に使えますか?

はい。すべての計算はブラウザ内で行われ、入力した内容が当社サーバーに送信されることはありません。

スマートフォンでも使えますか?

はい。AndroidやiPhoneの最新ブラウザのほか、タブレットやパソコンでも使えます。インストールは不要です。

アカウントは必要ですか?

いいえ。ページを開いてツールを使うだけです。登録もメールアドレスも不要です。

関連ツール