Stylogenyin the style of Neumorphism

Digital native · 2019–2021 · Global / networked

Neumorphism

Also known as Neomorphism, Soft UI, New skeuomorphism

A short-lived interface trend in which controls are extruded from, or pressed into, a background of the same colour and modelled only by paired soft shadows. Sparked by Alexander Plyuto's 2019 Dribbble banking-app concept and named on UX Collective, it revived skeuomorphic tactility in a monochrome, minimal form, then faded quickly over its weak contrast and poor accessibility.

Make something in this styleGet advice in this styleMix it with another style

A pale blue meditation app screen titled “Calm Mode” shows a large circular 25-minute timer with a purple progress arc and a play button beneath it. Raised, softly shadowed controls include settings and bottom navigation for Focus, Sleep, Breathe, and Journal.
AI-generated by Stylogeny from the style’s design choices. Not a real or historical work.

01

How it works

  • Give each control the same colour as its background and model it only with two soft shadows: a light one top-left and a dark one bottom-right.
  • Show pressed and active states by switching to inset shadows, so controls appear pushed into the surface.
  • Keep the palette to one desaturated hue, usually a pale grey-blue, plus a single accent for state.
  • Round every corner generously and favour circular dials, knobs and pill-shaped toggles.
  • Leave wide gaps between elements so the shadows can breathe without colliding.
  • Add borders, labels or a contrasting accent wherever soft relief alone would fail accessibility.

Dribbble and UX Collective design community (Alexander Plyuto, Michal Malewicz)

02

Its design choices

From Stylogeny’s vocabulary of design choices: defining choices make the style, characteristic ones are usual, occasional ones turn up now and then.

Layout & composition
Space & hierarchy
Typography
Colour
Form & shape
Surface & texture
Ornament
Imagery
Medium & production
Tone & intent
Avoids
Hard offset shadow, Gloss & highlights, Complementary clash, Full polychrome, Fluorescent & neon, Horror vacui, Extreme scale contrast, Abundant decoration

Palette

  • #e0e5ec
  • #ffffff
  • #a3b1c6
  • #31456a
  • #6c63ff

Typefaces

  • Poppins

  • Nunito

  • SF Pro

  • Montserrat

Known for

  • Alexander Plyuto, 'Skeuomorph Mobile Banking' concept on Dribbble

    2019

  • Michal Malewicz (HYPE4), 'Neumorphism in user interfaces', UX Collective

    2019

  • Adam Giebl, neumorphism.io CSS generator

03

Make something in this style

Say what you need, and Stylogeny’s image studio draws it from Neumorphism’s design choices and checks it against them. It takes about a minute, and you get a link to share.

Rule out a choice, read the prompt, or blend in another style: take this brief to Mix styles.

04

Where it comes from, and what it’s close to

Before it

The style it grew out of, and the styles it borrowed from.

This styleNeumorphism2019–2021 · Global / networked

After it

The styles that grew out of it.

Alike in its design choices

Styles that make many of the same choices, related or not, besides those above.

05

Real works

Artefacts in museums, libraries and archives that show the style, linked at their source.

06

Sources

  1. Michal Malewicz, 'Neumorphism in user interfaces', UX Collective (December 2019)
  2. Wikipedia, 'Neumorphism' (en.wikipedia.org/wiki/Neumorphism)

How Stylogeny researches and checks a style: where the facts come from.