CSS ボックスシャドウ生成ツール
複数レイヤーの CSS ボックスシャドウと内蔵プリセット(ソフト、浮き出し、ニューモーフィズム)を生成。CSS、Tailwind、React インラインスタイルを出力。
#css#box-shadow#shadow#design#neumorphism#generator
Loading tool...
How to use
- 1パラメータを入力:x=0 y=4 blur=12 spread=0 color=#000000 opacity=0.15
- 2"---" を使用して複数のシャドウレイヤーを区切る
- 3"preset=soft" を入力してすべての利用可能なプリセットを表示
Frequently Asked Questions — CSS ボックスシャドウ生成ツール
インセットシャドウとは何ですか?+
インセットシャドウは要素の外側でなく内側に現れます。パラメータで "inset=true" を使用します。押された/凹んだ効果を作るのに最適です。
ニューモーフィズムとは何ですか?+
ニューモーフィズムは、明と暗の 2 つのシャドウを同時に使用して、要素が背景から浮かび上がるような錯覚を作る UI デザイントレンドです。