Neumorphism
Soft UI
Neumorphism (or Soft UI) uses coordinated light and dark box shadows to make interface elements appear extruded from or pressed into the background surface. It evokes the satisfying physicality of soft plastic and silicone, creating a tactile illusion that challenged the flat paradigm when it appeared in 2019.
From a Dribbble shot to a design conversation
Neumorphism emerged almost overnight from a single viral post and spread through design communities at remarkable speed. Its rapid rise was matched only by the speed with which accessibility advocates identified its structural flaw.
The viral origin
Alexander Plyuto's Dribbble shot "Skeuomorphism is making a comeback" goes viral and names the trend, coining the portmanteau of "new" and "skeuomorphism".
Kit and tutorial explosion
A flood of Neumorphism UI kits and tutorials appears; the style dominates Dribbble and Figma community resources for much of the year.
Accessibility reckoning
Accessibility criticisms mount: insufficient contrast makes neumorphic UIs nearly unusable for users with low vision or in bright environments.
Restrained survival
Restrained use survives in calculator apps, music players, and UI concept work where the tactile aesthetic outweighs functional constraints.
Shadow as the sole sculptor of form
Extruded Shadows
Two box-shadows (one lighter, one darker than the background) simulate a raised surface emerging from the same material. The direction and softness of each shadow define the perceived height of the element.
Matched Background
Elements share the exact background color; only shadow creates the illusion of volume. Any color difference between the element and background would shatter the seamless material illusion.
Minimal Color
Near-neutral palettes (light greys, warm whites, soft beige) with one soft accent color. Saturated or high-contrast colors break the cohesion of the shared-surface effect.
Pressed States
Inverted shadows show an element "pushed in" on press, giving satisfying tactile feedback. The transition from extruded to inset communicates interaction state through the language of physical materials.
Small controls, controlled contexts
Neumorphism works best when the interface is the entire product and the palette can be locked to a single background tone. It is less a system for building comprehensive UIs and more a finish applied to focused, limited-control surfaces where tactility is the point.
- 01Calculator & Utility AppsDiscrete buttons on a single-tone surface make ideal neumorphic targets
- 02Music PlayersKnobs, sliders, and transport controls benefit from the tactile volume illusion
- 03IoT & Smart Home ControlsDashboard widgets mimicking physical switches and dials for home automation
- 04UI Portfolio ExplorationsConcept work and case studies that showcase shadow craftsmanship and attention to detail
Where the style lives on
Because neumorphism's challenges prevent it from serving full production apps, its best examples tend to live in design community platforms and concept showcases rather than shipping products.
The reference generator for the style: paste in a colour and get the exact box-shadow values that produce the soft-extrusion effect. The tool that spread the technique globally.
A full component library built entirely in the neumorphic style — cards, buttons, forms, and navigation all rendered in soft extruded surfaces.
The trade-offs
+ Strengths
- Unique tactile quality unlike anything else in digital design
- Unforgettable as a portfolio or concept piece; it stops scrolling
- Dark mode works naturally; invert the shadow palette and the effect holds
- Transition animations between extruded and inset states are inherently satisfying
− Watch-outs
- Severe accessibility issues: contrast ratios below 3:1 are structural, not incidental
- Extremely narrow contextual fit; almost no production app can justify full adoption
- Difficult to scale beyond simple controls without the illusion breaking down
- The style's peak association with 2020 Dribbble means it can appear dated quickly
Builds coming soon
This style hasn't been built yet. Check back later.