
ニューモーフィズムをもっと知りたい!#figma
本日はニューモーフィズムのバリエーション2つに挑戦してみたいと思います。
先日投稿したこちら👇からまず始めてみてくださいね。
1、くぼんだオブジェクト
まずはこちらのくぼんだオブジェクトに挑戦です。
1, 前回作った正方形を複製。(右下に配置しています)
2、複製した正方形をクリックし、Drop shadow 2つをどちらも Inner shadowにする。
3, 完成!へこみました!
2、オブジェクトを重ねる
今度はこちらのような重ねたデザインに挑戦です!
1, くぼんだ正方形を複製。(右下に配置しています)
2, Drop shadow を追加。
x10
Y10
Blur 20
color B4C1D5 50%
3, 再度Drop shadow を追加。
x-10
Y-10
Blur 20
color FFFFFF 90%
4, 作った正方形を複製。そして小さくする。
5, 重ねて配置
6, 小さい正方形のDrop shadow 2つをInner shadowに、
Inner shadowをDrop shadow にする。
7, Inner shadowを両方隠す。
8, 完成!中の正方形が押し出されました!
今回はここまでです。また次の記事でお会いしましょう🥰
追伸
こちら👇のプラグインでも簡単にできますよ♪
Follow me here😊
Website | Instagram | Twitter │ Dribbble│Linkedin
いいなと思ったら応援しよう!
