◩
画像・デザインツール
Box Shadow Generator
Box Shadow Generator は入力をサーバーへ送らず、ブラウザ上で確認、変換、結果作成を行うツールです。
画像・デザインツール
Input / output
Shadow preview
2 layers
CSS 코드
box-shadow: 0px 8px 24px -8px rgb(0 0 0 / 0.18), 0px 2px 6px 0px rgb(37 99 235 / 0.12);
Tailwind shadow
shadow-[0px_8px_24px_-8px_rgb(0_0_0_/_0.18),_0px_2px_6px_0px_rgb(37_99_235_/_0.12)]
Shadow layers
Layer 1
Layer 2
HelpOpen usage notes, examples, practical tips, and FAQ only when you need them.
What is this tool?
Box Shadow Generator は 画像とデザインのワークフロー のためのブラウザ内ツールです。入力、設定、結果を 1 ページで扱えます。
How to use it
- 入力を貼り付ける
処理したい値を入力エリアに入力または貼り付けます。
- オプションを調整する
box shadow, CSS shadow, elevation に合うモード、形式、単位を選びます。
- 結果を確認する
ツールを実行し、内容を確認してからコピーまたはダウンロードします。
Examples
Box Shadow Generator の例
- Input
- サンプル入力
- Output
- ブラウザで確認した出力。
Practical tips
- 大きな入力はまず小さなサンプルで試してください。
- 広告は入力、操作、結果エリアの外に配置されます。
FAQ
Box Shadow Generator には何を入力しますか？
画面のタスクに合う値を入力し、実行前にオプションを確認してください。
Box Shadow Generator の結果はコピーできますか？
はい。結果を確認してからコピーまたはダウンロードできます。
Box Shadow Generator はモバイルで使えますか？
はい。入力、設定、結果は小さな画面でも使いやすく並びます。
入力はサーバーに送信されますか？
いいえ。入力はブラウザ内で処理される設計です。