2022-Present — Era

Claymorphism

Elementos 3D con apariencia de arcilla y sombras suaves.

Claymorphism (or Clay UI) is a design trend that combines 3D modeling characteristics with a soft, matte finish resembling clay. It emerged as a friendly, approachable alternative to the hyper-realistic or purely flat styles. It uses rounded corners, inner shadows, and outer drop shadows to create a fluffy, tactile appearance that invites users to touch.

The Metaverse Influence

The rise of Claymorphism is closely tied to the hype surrounding the Metaverse and VR/AR interfaces. In 3D environments, simple, low-poly shapes with soft lighting are easier to render and easier on the eyes than photorealistic textures. This aesthetic—seen in avatars, crypto-art, and virtual worlds—migrated to 2D web design.

It conveys a sense of playfulness and youth. It is often used in fintech apps, educational platforms, and NFT marketplaces—sectors that want to appear modern and accessible rather than stiff and traditional.

Anatomy of Clay

To achieve the clay look in CSS or design tools like Figma, designers use a specific combination of effects:

  1. Background: Usually a light, pastel color.
  2. Shape: High border-radius (very round).
  3. Inner Shadow: A light inner shadow on the top-left to simulate volume and softness.
  4. Drop Shadow: A soft, directional shadow on the bottom-right to lift the element off the page.
  5. Typography: Rounded, bold sans-serif fonts that match the bubbly aesthetic.

Unlike Neumorphism, which tries to be part of the background, Claymorphism elements clearly float above the background. They feel like stickers or fridge magnets.

Claymorphism
Fuente: https://dribbble.com/shots/26070201-Cute-Pony-in-3D-style-Patel-3D-Pony-Design
Claymorphism
Fuente: https://dribbble.com/shots/26070201-Cute-Pony-in-3D-style-Patel-3D-Pony-Design
Claymorphism
Fuente: https://dribbble.com/shots/26070201-Cute-Pony-in-3D-style-Patel-3D-Pony-Design

Friendly Design

The psychological impact of Claymorphism is significant. It reduces anxiety. The soft shapes and lack of sharp edges make interfaces feel safe and forgiving. This is why it’s so popular in apps that deal with money or complex tasks; it lowers the cognitive load and makes the user feel at ease.

However, it can also feel childish. It is not appropriate for a serious legal firm or a luxury fashion brand. It is a specific tool for a specific vibe: friendly, digital-native, and fun.

Key Characteristics

  1. Matte Finish: No glossy reflections, just soft diffusion.
  2. Pastel Palette: Light pinks, blues, and purples are common.
  3. Floating Effect: Strong separation from the background.
  4. 3D Illustration: Often paired with 3D characters or icons.
  5. Rounded Typography: Fonts that echo the geometry of the containers.