Pickupニュース

CSS matic: Box Shadow
Webサービス

CSS matic: Box Shadow

CSSボックスシャドウシミュレート
Webブラウザ上でbox-shadowプロパティ用のシャドウパターンを作成して、CSSコードを出力するWebサービスです。

CSS matic: Box Shadowのご利用はこちらから

Webサイト

動画デモ

CSS matic: Box Shadowの動画デモです。

https://www.youtube.com/watch?v=k-ut79X6-Wo

解説

  1. Horizontal Lengthで影の水平方向の距離、Vertical Lengthで影の垂直方向の距離を指定します。
  2. Blur Radiusでぼかし距離、Spread Radiusで広がり距離を指定します。
  3. Shadow Colorで影の色を指定します。
  4. Background Colorで背景色、Box Colorでボックスの背景色を指定します(これらはプレビュー用でスタイルシートには反映されません)。
  5. Opacityで影の透明度を指定します。
  6. Copy Textボタンをクリックして生成されたスタイルシートをコピーして使用します。

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

記事ランキング