UTILS.
100% ブラウザ内で完結

ニューモーフィズムジェネレーター

ライブプレビュー付きでソフト UI のニューモーフィックな影を作成してコピーできます。

このツールについて

明暗一対の影、調整可能なサイズ、距離、強度、ぼかし、凸または凹の見た目を備えたソフト UI のニューモーフィック要素をデザインし、CSS をコピーできます。すべてブラウザ内で動作します。

よくある質問

ニューモーフィズムが2つの影を使うのはなぜですか?
対角の隅に明るい影と暗い影を一つずつ置くことで単一の光源を模倣し、要素が背景から浮き出ているように見せます。
凸(convex)と凹(concave)の違いは何ですか?
凸は表面から盛り上がって見え、凹はグラデーションと影を反転させることで要素が押し込まれているように見せます。

その他のツール