Neumorphism in Figma 😍👌 | Soft UI Design (

Поделиться
HTML-код
  • Опубликовано: 10 июл 2024
  • Neumorphism in Figma | Soft UI Design - Figma Tutorial 😇
    In this video you'll get to learn about neumorphism ui design using the figma. 😍 I will be demonstrating how to create neumorphism ui components inside figma so that you can quickly build your projects without having to create these neumorphic design again and again. You can pull out the neumorphic design components and quickly build your porjects.
    Neumorphism design in figma is used by creating multiple drop-shadow and inner-shadow along with the same background color on which components are being created.
    #Neumorphism #Figma #SoftUi #Design #UiDesign #NeumorphicUI #NeumorphismDesign #NeumorphismUI
    Creating Neumorphism in Adobe Xd:
    • Neumorphism Design in ...
    ===============Awesome Videos on CSS3====================
    Placeholder Animation CSS - Floating Label Animation - Move placeholder to top | No Javscript
    • Placeholder Animation ...
    Responsive login form with animated input placeholder using html css & javascript
    • Responsive login form ...
    How to Apply Gradient Animation on button background in CSS
    • How to Apply Gradient ...
    Clip image to text using CSS background-clip | CSS Text Knockout Effect
    • Clip image to text usi...
    CSS Sticky Header - Fixed Navigation Menu Bar on Scroll using HTML5 and CSS3
    • CSS Sticky Header - Fi...
    Creating Automatic CSS Image slider with CSS3 animation & HTML5 | No Javascript or Jquery - Tutorial
    • Creating Automatic CSS...
    Simple Responsive Navigation Menu Bar with Logo on Left Using HTML5 and CSS3 Flexbox - Tutorial
    • Simple Responsive Navi...
    How to Create Masonry Layout CSS3 & HTML5 - Material Design Card Based Pinterest Like Column Layout
    • How to Create Masonry ...
    How to Create Download Link in HTML5 | Making Direct Downloadable Button for Any File Type
    • How to Create Download...
    How to Create Simple HTML5 / CSS3 Preloader Animation | Circular Spinner Preloader - RUclips
    • How to Create Simple H...
    How to add a Preloader in Website using HTML, CSS and Javascript
    • How to add a Preloader...
    Find all the source codes here:
    codepen.io/smashtheshell
    Follow on Twitter
    / amit4kp

Комментарии • 146

  • @allanwlarsen
    @allanwlarsen 2 года назад +1

    A really really good instruktion - everything explaned. I’m new to Figma, and it helped me a lot. And what a cool design 🙏💪🏼

  • @alexisabakasanga
    @alexisabakasanga 3 года назад +3

    This was a really calm tutorial, Thank you I learnt a lot!!!

  • @user-kr7hf8bo2l
    @user-kr7hf8bo2l 3 года назад +2

    Awsome lesson! Thank you very very much!

  • @yoyoyolo9843
    @yoyoyolo9843 2 года назад +1

    Thank you for your tutorial. This is my first time using Figma. I am able to follow with your great instructions.

  • @bellyjar3020
    @bellyjar3020 Год назад +1

    What an amazing videoz I learned a lot from this. You made something so complicated learned simply, thank you so much ❤️

  • @designedbybabs
    @designedbybabs 2 года назад +3

    Thank you so much for this video! It's amazing and so useful for my work! Maybe you could include also Font/ Typography in this style, would be nice to see that too.

  • @miya13213
    @miya13213 Год назад

    Amazing sharing, thank you so much 🎉

  • @lostinhorizonchannel
    @lostinhorizonchannel Год назад

    Thank you! As a beginner this video helps me a lot to learn something new step by step.

  • @akinroyebiayomide8333
    @akinroyebiayomide8333 2 года назад +1

    this content is awesome, so many things to learn within a short time. thank you

  • @TheCalmWoodsman
    @TheCalmWoodsman 2 года назад +7

    Light Shadow #FFFFFF at50%, x:-6, y:-6, Blur:16
    Dark Shadow #D1CDC7 at 50%, X:6, Y: 6, Blur: 16
    Looks better and it is main settings of neumorphism.
    Awesome vid indeed!!!!!

  • @NehaDevi_GudiyaVS
    @NehaDevi_GudiyaVS 2 года назад +1

    This is amazing. You made everything so easy.. Thank You..

  • @minoum8588
    @minoum8588 2 года назад

    I did it! Amazing! A million thank yous to you, my friend!

  • @Epicedits2555
    @Epicedits2555 Год назад

    Great video, learned a lot from this. can’t wait to try these on my next design.

  • @pabbathiramakrishna6542
    @pabbathiramakrishna6542 3 года назад +1

    Bro, You are just awesome. I am worrying about Drop shadows from last 48 hours. You got me in 30 minutes 😅. Thanks a lot

  • @doublegameplaysandscriptin977
    @doublegameplaysandscriptin977 Год назад

    TNice tutorials was so detailed! Great video for beginners. Thank you!

  • @imadbabi7646
    @imadbabi7646 Год назад

    You are a living god among n, a legend worthy of praise. What you've uploaded here, will echo into eternity!

  • @user-sz7is6uu7p
    @user-sz7is6uu7p Год назад +1

    Awesome!!!, thank you so much for sharing your knowledge.

  • @smashtheshell
    @smashtheshell  3 года назад +3

    Hi! Thanks for checking this video out. See how to do neumorphism in Adobe XD: ruclips.net/video/8hQ6heG82aA/видео.html
    Please subscribe to help me reach 5K. 👏😊

  • @EsmaNurEmre
    @EsmaNurEmre 2 года назад

    Thank you so much. It was perfect!

  • @balajin3234
    @balajin3234 3 года назад

    thank you soooo much for this video. ❤🙏

  • @besaurieng
    @besaurieng 2 года назад

    Amazing! thank you so much :D

  • @wasabbyy
    @wasabbyy Год назад

    thank you for this tutorial. great explanation!!

  • @JanobPanda
    @JanobPanda Год назад +1

    thank you so much.I am very happy!

  • @karthickt7
    @karthickt7 Год назад

    I just learnig Figma. You're the only one who made me understand what Master. Thank Sir :)

  • @Commandraa
    @Commandraa 19 дней назад

    This is lovely. Thank you

  • @arunguile1654
    @arunguile1654 2 года назад

    Very easy to understand ♥️keep going

  • @KULDEEPKUMAR-yb9is
    @KULDEEPKUMAR-yb9is Год назад

    Thank you so much sir!, I was need it

  • @hamidmubariz6531
    @hamidmubariz6531 2 года назад

    This is awesome.
    Thank you.

  • @Fooddaddy07
    @Fooddaddy07 2 года назад +1

    Thank you sir.. it's really helpfull and detailed .. looking forward more trading styles from your side.. 👍

  • @daryaazarenka6497
    @daryaazarenka6497 Год назад

    Thank you so much! it was very useful!

  • @kayyeful
    @kayyeful Год назад

    man. Thank you!

  • @Novaprod-jn4kq
    @Novaprod-jn4kq Год назад

    dedication to what you want to acNice tutorialeve in life! Stay safe and be wise! Much love!

  • @kimywar
    @kimywar 2 года назад +3

    Thank you very much, following this tutorial has been great!

    • @smashtheshell
      @smashtheshell  2 года назад +1

      Thank you Andreia! I am glad it helped 😊😊

  • @KalyaniTalks
    @KalyaniTalks 3 года назад

    Just amazing thanku so much

  • @emannofal1759
    @emannofal1759 Год назад

    you r such an amazing person how u make this so simple like that may allah bless u thank u soo much❤❤❤

  • @snehalshukla2601
    @snehalshukla2601 2 года назад

    incredible video love it i learn a lot

  • @sandyyy____
    @sandyyy____ 2 года назад

    You're the only one who made me understand what "master component" is all about. Kudos to you, sir! :)

  • @niwala2546
    @niwala2546 Год назад

    thank you so much sir, amazing video

  • @nikolapuszkova215
    @nikolapuszkova215 Год назад

    Thanks for the vid!

  • @amandasalgueiro
    @amandasalgueiro 2 года назад

    Amazing! Thanks for share! Please, send more videos about Figma!

  • @Idonije_E
    @Idonije_E 2 года назад

    Wow, I love this so so much

  • @morvaridmeshkini1577
    @morvaridmeshkini1577 2 года назад

    Thank you so much. You made it easy to follow! woohoooooo

  • @MOHAMEDHASSAN-fk9jv
    @MOHAMEDHASSAN-fk9jv 3 года назад

    Simple and fantastic 👍👍👍

  • @AmiraMohamed-jf5tl
    @AmiraMohamed-jf5tl 2 года назад +2

    Really cool video! I enjoyed watching the different ways we can use neumorphic components.

  • @ShaliniRobinson
    @ShaliniRobinson 2 года назад +4

    Thank you so much for this Figma lesson. It's really good and you explained step-by-step really well.

  • @aparnas7588
    @aparnas7588 3 года назад

    Thank you so much for this video

  • @luizfaria4974
    @luizfaria4974 Год назад

    nice tuto bro, that solved!

  • @Yusuf_dyms69
    @Yusuf_dyms69 Год назад

    Organization is a key to success

  • @gitrextut
    @gitrextut Год назад

    very helpful and simple man.. i tNice tutorialnk i'm gonna see all your videos

  • @zakirahmed4783
    @zakirahmed4783 2 года назад

    Lot,s of tnx bro for your excellent figma videos...... & we need more figma videos...For example, figma animation videos.

  • @adesinaoluwasanmi5793
    @adesinaoluwasanmi5793 2 года назад

    Thanks for this

  • @misonosenpai3168
    @misonosenpai3168 Год назад

    This video is great. Thank you very much

  • @sairajshetkar3442
    @sairajshetkar3442 3 года назад

    Good one 👍

  • @KULDEEPKUMAR-yb9is
    @KULDEEPKUMAR-yb9is Год назад

    Thank you so much sir! ❤️ love form India

  • @user-fl5sj7nx6b
    @user-fl5sj7nx6b Год назад

    Thank you My Friend! :)

  • @subhraprakashmohanty8139
    @subhraprakashmohanty8139 Год назад

    Very helpful thankyou

  • @priyanshpatel-india
    @priyanshpatel-india Год назад

    Excellent video

  • @bravosix6109
    @bravosix6109 Год назад

    Thank You!

  • @mohammadshakil1625
    @mohammadshakil1625 Год назад +1

    Thanks you so much

  • @varshamishra9461
    @varshamishra9461 2 года назад

    Thanks!

  • @juliencarvalho4881
    @juliencarvalho4881 Год назад

    Nice video

  • @noviyanaling695
    @noviyanaling695 3 года назад +2

    That's really cool and fun stuff to do so♥️

  • @classyislive8547
    @classyislive8547 Год назад

    tNice tutorials was very help full thanks for the information

  • @melinagolfaridan1433
    @melinagolfaridan1433 2 года назад

    amazing thank you

  • @user-kn7sl1zv4h
    @user-kn7sl1zv4h 3 года назад +1

    10 q so much, it is very useful

  • @minsetsoo3160
    @minsetsoo3160 2 года назад

    Thank you so muchh

  • @MonKiwiLuffy
    @MonKiwiLuffy 3 года назад

    Nice video, I love

  • @zbigniewmatczak7970
    @zbigniewmatczak7970 2 года назад

    Nice job :)

  • @BlitzYT_.
    @BlitzYT_. Год назад

    Thank you sir

  • @sridharsrigiriraju4583
    @sridharsrigiriraju4583 3 года назад +1

    Amazing!! Thank you so much!!

  • @daniellemclean6896
    @daniellemclean6896 2 года назад +1

    Woah. You just changed my life!!!!!!! Thank you so much

  • @mashhoodlive
    @mashhoodlive 2 года назад

    Very well

  • @olehchornyi6193
    @olehchornyi6193 9 месяцев назад +1

    Thanks alot! Very clear Neumorphism presentation! Keep it up!

  • @ronyshowa
    @ronyshowa 3 года назад +3

    Very clear explanations and process 🙏🏾

    • @smashtheshell
      @smashtheshell  3 года назад

      Thank man! 😍 I glad you like the video

  • @1980rajashree
    @1980rajashree 3 года назад +1

    Excellent video. Thankyou so much.

  • @bmp4music
    @bmp4music 3 года назад +1

    Very useful !!!!! Thank you !!!

  • @RuztomLamundao
    @RuztomLamundao Год назад

    can you do a full tutorial from downloading a free vst till importing into soft soft please?? im new to the interface and software

  • @navnoorsingh288
    @navnoorsingh288 3 года назад +3

    It's awesome! By far the best video about neumorphism!!

  • @olgakontsova8761
    @olgakontsova8761 2 года назад +1

    Thanks a lot! It was very informative and good video.

  • @gunayfarzalibayli2172
    @gunayfarzalibayli2172 11 месяцев назад

    Thanks

  • @mohammadshakil1625
    @mohammadshakil1625 Год назад

    Please give more of this type of bdo

  • @julietkan
    @julietkan 2 года назад

    Thank you very very much!!!!!

  • @MiguelRamirez-vm1ni
    @MiguelRamirez-vm1ni Год назад

    nice

  • @taylorskurka
    @taylorskurka 3 года назад +1

    so helpful!

  • @dotcore1150
    @dotcore1150 3 года назад +1

    really great content !

  • @deveshsolanki8875
    @deveshsolanki8875 3 года назад +1

    Great ✔👌⭐️

  • @alexanderpan
    @alexanderpan 3 года назад +2

    Thank you!

  • @Osmosick
    @Osmosick Год назад

    What shadow colour to choose on a white background?? Please help

  • @alsoualsou9
    @alsoualsou9 3 года назад

    thx!!!

  • @DimTragic
    @DimTragic Год назад

    Any way to use it along side the auto-layout property?

  • @reallyfree494
    @reallyfree494 3 года назад +2

    Amazing

  • @theroman712
    @theroman712 Год назад

    I hope you get what you're looking for!

  • @margaretedecruz3091
    @margaretedecruz3091 Год назад

    Also your mind catches more stuff when you're interested

  • @daparthiyamini4532
    @daparthiyamini4532 3 года назад +1

    it was really very useful

    • @smashtheshell
      @smashtheshell  3 года назад

      Nice to hear that you found it useful 😊

  • @ShopperPlug
    @ShopperPlug Год назад

    is it possible can you make a video to show how to extract it to HTML/CSS using anima or similar?

  • @SURAJ-R.SOMAPPA
    @SURAJ-R.SOMAPPA Год назад

    u change it to "Analog app 1 TE" to get the sa soft as Nice tutorialm. Hope tNice tutorials helped!

  • @DesignSomething
    @DesignSomething Год назад

    I must confess that learning how to use the software is what gets procastinating to start making soft. It scares lol

  • @daDimitriTube
    @daDimitriTube 3 года назад +1

    Thanks for sharing. Great work. May well become a trend this. Has potential.

    • @smashtheshell
      @smashtheshell  3 года назад

      I am delightful to hear that. Thanks a lot. 😊

  • @atul708
    @atul708 Год назад

    man!

  • @jennyjohanagallo5360
    @jennyjohanagallo5360 Год назад

    Nice tutorial Micheal ,is it absolutely necessary to have knowledge of soft to use tNice tutorials software?

    • @smashtheshell
      @smashtheshell  Год назад

      Who's this Micheal? Where this video is linked? Could you share the link?