---
name: Claymorphism
slug: claymorphism
category: aesthetic
status: published
created: 2026-08-21T00:00:00.000Z
modified: 2026-08-21T00:00:00.000Z
definition: "A soft style where controls look inflated from clay: pastel fills,
  very large corner radii, an inner highlight, and a tinted drop shadow."
aliases:
  - name: clay UI
  - name: claymorphic design
  - name: play-doh UI
    source: community
  - name: puffy 3D buttons
    source: community
tags:
  - depth
relations:
  contrastWith:
    - deformable-ui
    - neo-skeuomorphism
    - neumorphism
  variantOf: []
  partOf: []
  seeAlso:
    - glassmorphism
    - kawaii-ui
implementations: []
sources:
  - title: "Superdesign: UI style catalog"
    url: https://superdesign.dev/styles
  - title: "Wow-How: 4 Main Types of Morphism in UI Design"
    url: https://wow-how.com/articles/types-of-morphism-in-ui-design
demo: inline
exhibit: false
useWhen: puffy pastel surfaces that look moulded
---

Four things make a surface read as clay, and dropping any one of them breaks the
illusion. The corner radius has to be far larger than a normal card would use, big
enough that the shape looks moulded rather than cut. The fill is pastel and flat. A
light inner shadow at the top left and a darker one at the bottom right give the face
its bulge. Last, an outer drop shadow tinted toward the fill's own hue, not toward
grey, lifts the object off the background the way a soft solid casts light back into
its own shadow.

The style arrived around 2021, in the same wave as glassmorphism, and it owes more to
3D illustration than to any platform. Its natural home is products that want to feel
friendly and unserious: onboarding, kids' apps, fitness and habit trackers, pricing
pages. It also carries the same physical promise a real button does, which is why the
press state matters so much here. A clay control that does not squish under the
pointer reads as a picture of a button rather than a button.

The costs are contrast and hierarchy. Pastel fills with dark text sit near the bottom
of the contrast range you are allowed, and the inner highlight eats into that further
at the top edge. The huge radius also spends horizontal space that dense layouts do
not have, so clay works on a handful of large targets and falls apart in a toolbar. And
because every surface is equally soft and equally friendly, importance has to come from
size and colour temperature, since elevation is already spent on making everything
look inflated.