20+ CSS Neumorphism Examples - Free Code + Demos

Collection of 20+ CSS Neumorphism Examples. All items are 100% free and open-source.

1. Neumorphism - Animated Social Icons

CSS Neumorphism Examples - Neumorphism - Animated Social Icons
Author: Jitendra Nirnejak (nirnejak)
Created on: January 13, 2020
Made with: HTML, SCSS
Tags: social, icons, neumorphism, 2020, skeuomorphism

2. Payment App (Neumorphism)

CSS Neumorphism Examples - Payment App (Neumorphism)
A sample neumorphism (soft ui) implementation. Inspiration from https://dribbble.com/shots/9133987-Payment-App.
Author: Steven Brannum (sdbrannum)
Created on: December 28, 2019
Made with: HTML, SCSS, JS
Tags: softui, soft-ui, neumorphism, trend, soft ui

3. Soft-UI Button Pattern

CSS Neumorphism Examples - Soft-UI Button Pattern
Multi button with Soft UI
Author: Tyler Scott Williams (ogdenstudios)
Created on: January 6, 2020
Made with: HTML, CSS
Tags: codepenchallenge, cpc-multi-button

4. Neumorphism UI // Button

CSS Neumorphism Examples - Neumorphism UI // Button
Example of Neumorphism realised with SCSS'
Author: Cosimo Scarpa (coswise)
Created on: January 4, 2020
Made with: HTML, SCSS, JS
Tags: neumorphism, scss, ui, button

5. Neumorph Test

CSS Neumorphism Examples - neumorph test
Author: victor (VictorUx)
Created on: December 27, 2019
Made with: HTML, SCSS

6. Neumorphism Calculator Design

CSS Neumorphism Examples - Neumorphism calculator design
Author: Ifeanyi Kelvin Ossai (KelvinBLAZE)
Created on: December 25, 2019
Made with: HTML, CSS, JS

8. Neumorphism Button

CSS Neumorphism Examples - Neumorphism Button
A simple and easy way to do realistic looking buttons for a smooth User Experience.
Author: Sebastian Piskaty (sebastian-piskaty)
Created on: December 23, 2019
Made with: HTML, SCSS, JS
Tags: button, box-shadow, animated, menu-button, neumorphism

9. Neomorphic Form

CSS Neumorphism Examples - Neomorphic Form
Author: Swapnil (swapnet)
Created on: January 28, 2020
Made with: HTML, SCSS

10. Animated Neomorphic Toggle Button In CSS

CSS Neumorphism Examples - Animated Neomorphic Toggle Button in CSS
Author: halvves (halvves)
Made with: HTML, CSS

11. Neumorphic Radio

CSS Neumorphism Examples - Neumorphic Radio
Author: halvves (halvves)
Created on: February 5, 2020
Made with: HTML, CSS
Tags: neumorphism, radio-button, ui, soft ui, neumorphic

12. Neuburger

CSS Neumorphism Examples - Neuburger
Hamburger menu button using the trendy neumorphism design aesthetic.
Author: Jacob (HuntingHawk)
Created on: February 4, 2020
Made with: HTML, CSS, JS
Tags: cpc-lines, codepenchallenge, neumorphism, hamburger-button, hamburger

13. Clean Neomorphic Toggle

CSS Neumorphism Examples - Clean Neomorphic Toggle
Author: Aaron Iker (aaroniker)
Made with: HTML, SCSS

14. Web OP-1

CSS Neumorphism Examples - Web OP-1
Inspired by Neumorphism, a new trend in UI design, I've coded a web version of an OP-1 synthesizer by Teenage Engineering
Author: Līva Raita (liva_raita)
Created on: January 6, 2020
Made with: HTML, CSS

15. Neomorphic UI Box

CSS Neumorphism Examples - Neomorphic UI Box
Recreating part of this Dribbble shot: https://dribbble.com/shots/7994421-Skeuomorph-Mobile-Banking
Author: Chris Weissenberger (CAWeissen)
Made with: HTML, SCSS

16. Neumorphic Playground 😅

CSS Neumorphism Examples - Neumorphic Playground 😅
Decided I'd dive in deep with the Neumorphism stuff and play with different types of inputs and surfaces. Used this as an opportunity to refine some dat.gui techniques and try out the scroll-snap techniques from an article on CSS Tricks 👍 Have fun, play around with different colors and ...
Read More
Author: Jhey (jh3y)
Created on: February 13, 2020
Made with: Pug, Stylus, Babel
CSS Pre-processor: Stylus
JS Pre-processor: Babel
HTML Pre-processor: Pug
Tags: neumorphism, react, config, design, soft

17. Neumorphic Buttons

CSS Neumorphism Examples - Neumorphic Buttons
Exploring new neumorphism design dribble : https://dribbble.com/shots/9194664-Neumorphic-Buttons
Author: Sikriti Dakua (dev_loop)
Created on: December 30, 2019
Made with: HTML, SCSS, JS
Tags: neumorphic

18. Neumorphism Modal (Color Changer)

CSS Neumorphism Examples - Neumorphism Modal (Color Changer)
Author: Scott Kellum (scottkellum)
Created on: January 7, 2020
Made with: HTML, SCSS, JS