ホーム › 生成とユーティリティ › CSSボックスシャドウ生成
← ホームへ戻る

CSSボックスシャドウ生成

複数レイヤーの影をプレビューしCSSをコピー。項目を入力してボタンを押すと結果が表示されます。

CSSボックスシャドウ生成について

複数レイヤーの影をプレビューしCSSをコピー。「X オフセット」・「Y オフセット」・「ぼかし」を入力して「生成」を押すと結果パネルに表示されます。処理はブラウザ内で完結し、入力内容は送信されません。

CSSボックスシャドウ生成は上のフォームの「X オフセット」・「Y オフセット」・「ぼかし」・「広がり」・「色」・「不透明度」を読み取り、結果パネルへ答えを書き出します。ログインやサーバーへの送信は不要で、ページ内の JavaScript が端末上で処理します。

使い方

  1. 生成とユーティリティカテゴリからCSSボックスシャドウ生成を開くか、ヘッダーの検索ボックスで探してください。
  2. ページの項目を入力します:「X オフセット」・「Y オフセット」・「ぼかし」・「広がり」・「色」・「不透明度」。
  3. 「生成」を押します。新しい結果が前回の結果を上書きし、表示されるのは常に現在の 1 回分だけで、2 つが並ぶことはありません。
  4. 「CSSをコピー」で結果をクリップボードへコピーできます。実際にコピーできたときだけメッセージが出ます。

使用例

上の項目に自分のデータを入力し、「生成」を押すと結果が出ます。入力を変えてもう一度押すと、現在の入力で再計算され前の結果を置き換えます。

よくある質問

入力した内容は送信されますか?

いいえ。CSSボックスシャドウ生成は「X オフセット」・「Y オフセット」・「ぼかし」・「広がり」・「色」・「不透明度」をブラウザ内の JavaScript で処理します。入力と結果は端末内に残り、Utilixoで複製は保存されません。

複数回の結果を並べて比較できますか?

できません。「生成」を押すたびに現在の入力で再計算され、前の結果を上書きします。比較したい場合は前回の値を控えてください。

CSSボックスシャドウ生成で気を付けることは?

結果はページ上の項目(「X オフセット」・「Y オフセット」・「ぼかし」・「広がり」・「色」・「不透明度」)だけで決まります。いずれかを変えて「生成」を押し直すと更新されます。

結果を持ち出すには?

結果が出たら「CSSをコピー」を押してください。空の結果では成功メッセージは出ません。

登録や料金は必要ですか?

不要です。CSSボックスシャドウ生成は無料・登録不要・回数制限なしで、ページを開けばすぐ使えます。

関連ツール

関連ガイド

より詳しい解説は生成ツールと便利機能ガイドをご覧ください。このカテゴリの各ツールを、実例とコツとともに順に紹介しています。