Are you tired of flat UI design that has been popular for years?
As modern web and mobile apps become more and more powerful, this visual language can no longer meet the increasingly complex UI design.
Google’s Material Design is born of this.
Material Design is inspired by the physical world and adds textures, reflects, shadows, layers, depths to flat design making UI elements more meaningful. Years after it was widely used in Android and Google products, this visual language also seems to be lagging behind.
In the first year of the 2020s, a new visual language called Neumorphism was gradually becoming popular.
What Is Neumorphism Design?
Neumorphism is a trending skeuomorphism UI design concept you might find on most UI design communities (e.g. Dribbble, Behance) that many designers are talking about.
As a matter of fact, it is a combination of Flat Design and Skeuomorphism Design that makes UI elements softer and more readable & ‘scannable’ to catch the user’s eyes.
Best Neumorphic UI Design Freebies
Still not sure what is Neumorphism Design? Take it easy.
Here is a list of popular Neumorphic UI design freebies (UI Kits, UI elements) & code snippets (JavaScript & CSS) for graphic designers and front-end developers. Have fun.
Last Updated: Dec 18, 2020
Table Of Contents:
- Neumorphic UI Kits
- Neumorphic CSS Frameworks & Code Snippets
- Neumorphic Icons
- Neumorphic Design Concepts For Inspiration
Neumorphic UI Design UI Kits:
Free Neomorphism UI Kit XD
Neumorphic Light Elements For Figma
Neumorphic style UX/UI elements in a Figma file.
Smart Home App Neumorphism Design
A neumorphic style smart home app design for Adobe XD.
Neumorphism UI Kit Figma
Neumorphism Dark UI KIT
A dark version Neumorphism UI kit in Figma format.
Neumorphic Shadow UI Pack
Finance App & Calculator Design
Minimal Neumorphism UI Kit
A minimal clean Neumorphism UI Kit for Figma app.
New Neumorphism And Soft UI Kit
A high quality, unique, dark Neumorphism Style UI Kit for Figma app.
Neumorphic Web Design
A Neumorphic style website template for Figma app.
Free Neumorphic UI Kit for Figma
A dark style Neumorphic UI Kit for Figma app.
Neumorphism Button Kit
A Neumorphism Button Kit (Dark & Light mode) to create Neumorphic style, rounded/circular buttons in your next design project.
Neumorphic Health & Workout App
A Neumorphic style app design (Adobe XD) for health, fitness, workout mobile app.s
FREE Neumorphic Elements Sketch File
Neumorphism UI Kit (3 Color Variables) Figma
A modern neumorphic UI Kit (Figma) that comes with 3 color variables: dark, light, and Purple.
Cool Neumorphism UI Kit
A cook neumorphic style UI Kit for sketch app.
Unicorn Neumorphism UI Elements
Neumorphism Smarthome Mobile UI
Google Neumorphism UI
Neumorphism UI Elements
A grey style Neumorphism UI Kit for Figma app.
Neumorphism Mobile Payment UI Design
Free Neumorphic GUI Unicorn Style
Neomorphic Travel UI Kit Free
Light Neumorphism UI kit for travel mobile app.
Free Neomorphic UI Kit for Adobe Xd
A light Neomorphic UI Kit for Adobe XD APP.
Dark Neomorphic UI Kit
A dark mobile & web UI kit in the neomorphic style. Available for Adobe XD app.
Neumorphism UI kit
Yet another Neumorphism UI kit for creating Neumorphic style mobile apps. Available for Figma app.
Neumorphism UI kit for Figma
A pretty clean Neumorphism UI kit for Figma app.
Dashboard Interface UI Kit For Sketch
Neumorphic App Template For XD App
Freebie Neumorphic UI Elements
A set of Neumorphism elements: progress bar, player controls, toggle button, form fields, etc.
Neumorphic UX UI Elements
A set of pretty clean Skeumorphic UX UI Elements for Sketch app.
Skeumorphic UI/UX Elements
Just nother Skeumorphic (Neumorphic) UI Kit for Sketch app.
Neomorphic Darkness Free UI Kit
A Neomorphic sci-fi UI Kit (Dark Mode) for Adobe XD.
Free Neumorphic UI kit Adobe XD
Free Neumorphic Shadows Library
Neumorphic Shadows for Sketch.
Neumorphic Finance App Design UI
A pretty nice Finance App UI kit following the Neumorphism specification.
Neumorphism UI kit
A Neumorphism UI kit designed for mobile app & dashboard & admin panel. Available as a Sketch file.
Skeumorphism UI Elements
A collection of Skeumorphism UI elements for Adobe XD app.
Neumorphic UI Frameworks & Code Snippets:
Analog Clock
A simple, Neumporphic style Analog clock (Dark & Light mode) built using plain JavaScript and CSS.
Full CSS Neumorphic Joystick
See the Pen
Full CSS Neumorphic Joystick by Vincent Durand (@onediv)
on CodePen.
Neumorphic Design Elements
See the Pen
Neumorphic Design Elements by Jack Domleo (@JackDomleo)
on CodePen.
Neumorphism UI Framework Based On Bootstrap 4
A Neumorphism UI framework for developers to create modern, clean, responsive, Neumorphic style (new skeuomorphism) web applications.
CSS Only Neumorphic UI Framework Based On Bootstrap – NenmorphismCSS
Just another CSS only Bootstrap 4 theme to create flat, elegant, Neumorphic style web pages inspired by the new Neumorphism UI design concept.
Neumorphic Tabs
See the Pen
Neumorphic tabs by Michael Burridge (@mburridge)
on CodePen.
Skeuos CSS library
Skeuos CSS is a lightweight Neumorphism UI Framework to quickly create a Neumorphic (Soft) UI style web application using pure CSS.
Neumorphic Elements
See the Pen
Neumorphic Elements by Maria Muñoz (@myacode)
on CodePen.
Neomorph UI Kit
See the Pen
Neomorph UI Kit by Julia Miocene (@miocene)
on CodePen.
Neuomorphic Checkboxes
Neumorphic style buttons built with pure CSS and checkboxes.
See the Pen
Neuomorphic Checkboxes by Braydon Coyer (@braydoncoyer)
on CodePen.
neumorph.scss
neumorph.scss is an SCSS library based on Bootstrap 4 that provides a variety of Neumorphic UI elements to implement the Neumorphism Design Trend on your webpage.
Soft UI CSS Shadow Generator
A convenient CSS shadow generator for Soft/Neumorphism UI design.
Neumorphic Playground
See the Pen
Neumorphic Playground 😅 by Jhey (@jh3y)
on CodePen.
Neumorphic Toggle
Neumorphic style toggle buttons implemented in pure HTML/CSS.
See the Pen
Neumorphic Toggle by halvves (@halvves)
on CodePen.
Neumorphic Buttons
A set of Neumporphic style actions buttons for the app.
See the Pen
Neumorphic Buttons by Dev Loop (@dev_loop)
on CodePen.
Neomorphic Form
A set of Neumporphic style form elements for the app.
See the Pen
Neomorphic Form by Swapnil (@swapnet)
on CodePen.
Neumorphism UI Kit
A Neumorphic Style UI kit containing buttons, grid layout, progress bar, form fields, and much more.
See the Pen
A bit of neumorphism by Damir (@drovosek2703)
on CodePen.
Neumorphism Soft UI Music Player
A Neumorphic style music player app written in JavaScript & CSS.
See the Pen
Neumorphism Soft UI Music Player by mixj93 (@mixj93)
on CodePen.
Neumorphic text
See the Pen
Neumorphic text by Agil Kerimov (@agilk)
on CodePen.
Neumorphism Social/News App Mockup
See the Pen
Neumorphism Social/News App Mockup by DavidH Dev (@davidhdev)
on CodePen.
Neumorphic Icons:
Neumorphism UI Icon Design
Neumorphism UI icons made in Adobe XD.
Icon Redesign
A set of 45 minimal clean neumorphic icons for Adobe XD.
Neomorphism Icons
A large set of Neomorphism Icons built with JavaScript, CSS, and Emoji.
Neumorphism Free Icon Set
20+ Neumorphism icons for 2020 UI design trend.
Neumorphic Design Concepts For Inspiration
Project Manager Dashboard Neumorphism UI
A dark Neumorphic style dashboard design for project manager app.
Google Drive Neumorphic Redesign
Google Drive desktop app re-designed in Neumprhic style.
Light Music Player
A light soft music player in the Neumorphic style.
Neumorphism Fitness Mobile App
A Neumorphism style fitness mobile application for inspiration.
Instagram Neumorphic Redesign Concept
Instagram App resign in the trending Neumorphic style.
Neumorphic style Dashboard Concept
More Resources:
When you’re developing a new web & mobile application using the Neumorphism trend, You may find the resources I listed above useful. To learn more about Neumorphism UI Design, here are a few more resources available online: