CSSボックスシャドウ生成
複数レイヤーの影をプレビューしCSSをコピー。項目を入力してボタンを押すと結果が表示されます。
CSSボックスシャドウ生成について
複数レイヤーの影をプレビューしCSSをコピー。「X オフセット」・「Y オフセット」・「ぼかし」を入力して「生成」を押すと結果パネルに表示されます。処理はブラウザ内で完結し、入力内容は送信されません。
CSSボックスシャドウ生成は上のフォームの「X オフセット」・「Y オフセット」・「ぼかし」・「広がり」・「色」・「不透明度」を読み取り、結果パネルへ答えを書き出します。ログインやサーバーへの送信は不要で、ページ内の JavaScript が端末上で処理します。
使い方
- 生成とユーティリティカテゴリからCSSボックスシャドウ生成を開くか、ヘッダーの検索ボックスで探してください。
- ページの項目を入力します:「X オフセット」・「Y オフセット」・「ぼかし」・「広がり」・「色」・「不透明度」。
- 「生成」を押します。新しい結果が前回の結果を上書きし、表示されるのは常に現在の 1 回分だけで、2 つが並ぶことはありません。
- 「CSSをコピー」で結果をクリップボードへコピーできます。実際にコピーできたときだけメッセージが出ます。
使用例
上の項目に自分のデータを入力し、「生成」を押すと結果が出ます。入力を変えてもう一度押すと、現在の入力で再計算され前の結果を置き換えます。
よくある質問
入力した内容は送信されますか?
いいえ。CSSボックスシャドウ生成は「X オフセット」・「Y オフセット」・「ぼかし」・「広がり」・「色」・「不透明度」をブラウザ内の JavaScript で処理します。入力と結果は端末内に残り、Utilixoで複製は保存されません。
複数回の結果を並べて比較できますか?
できません。「生成」を押すたびに現在の入力で再計算され、前の結果を上書きします。比較したい場合は前回の値を控えてください。
CSSボックスシャドウ生成で気を付けることは?
結果はページ上の項目(「X オフセット」・「Y オフセット」・「ぼかし」・「広がり」・「色」・「不透明度」)だけで決まります。いずれかを変えて「生成」を押し直すと更新されます。
結果を持ち出すには?
結果が出たら「CSSをコピー」を押してください。空の結果では成功メッセージは出ません。
登録や料金は必要ですか?
不要です。CSSボックスシャドウ生成は無料・登録不要・回数制限なしで、ページを開けばすぐ使えます。
関連ツール
- コイントス — 1枚または複数枚のコインを投げて結果を集計。
- カラーピッカー — 色を選んでHEX、RGB、HSL、コントラストを取得。
- サイコロシミュレーター — 任意の個数・任意の面数のサイコロを振る。
関連ガイド
より詳しい解説は生成ツールと便利機能ガイドをご覧ください。このカテゴリの各ツールを、実例とコツとともに順に紹介しています。