ソフト CSS ボックス シャドウ — 既製のコード
CSS ボックス シャドウ コードを視覚的に構築します。オフセット、ぼかし、スプレッド、不透明度のあるカラー、インセット モード、およびライブ プレビューを備えた最大 4 つのレイヤーのスライダー。
処理中...
0%
結果
このページでは、ソフト シャドウがプリロードされたボックス シャドウ ジェネレーターが開きます。水平オフセットなし、下 8 ピクセル、十分な 24 ピクセルのぼかし、および 12% の低い黒不透明度です。プレビュー カードはすぐにレンダリングします。スライダーを微調整すると、CSS 行がリアルタイムで追従します。
ソフト シャドウは、最新のインターフェイスの主力製品です。大きなぼかしと低い不透明度を組み合わせると、明確な輪郭を描かずにカードがページから浮き上がります。そのため、ほとんどのデザイン システムでは、初期のフラット デザインの濃い暗い影ではなく、まさにこの範囲にエレベーション シャドウが維持されます。
ボックスの影の線をスタイルシートに直接コピーするか、さらに 3 つのレイヤーを重ねてより豊かな立面図を作成します。ジェネレーターは完全にブラウザー内で実行され、どこにもアップロードされません。