Minkoi's App System
Style Library

Claymorphism Mobile (Nunito + DM Sans)

Font pairingdisplay rounded + geometric sans

Nunito + DM Sans — claymorphism, clay, rounded, playful, candy, bubbly, soft, 3d, children, education, tactile, spring, nunito, dm sans

claymorphismclayroundedplayfulcandybubbly
FontsNunito headingsDM Sans body

Preview

A sample page drawn from this style’s tokens — a guide to the look, not the exact output. Fonts from Google Fonts: Nunito, DM Sans.

New · weekly review

Plan the week in ten minutes

Pull in every task, see what matters, and share one clear plan with the team.

Get startedSee how it worksDocs
Tasks done1,284+12% this week
Sign in
Emailyou@example.com
Remember meContinue
Today
Review roadmapDone
Ship onboardingIn progress
Team sync3 pm
Prompt
Paste into any AI assistant before describing what to build — or attach it to a project below.
# Font pairing — Claymorphism Mobile (Nunito + DM Sans)

Headings: Nunito · Body: DM Sans
Mood: claymorphism, clay, rounded, playful, candy, bubbly, soft, 3d, children, education, tactile, spring, nunito, dm sans
Best for: Children education apps, teen social, brand mascot apps, creative tools, fintech gamification

Dual-stack: Nunito Black (900) or ExtraBold (800) for ALL headings — rounded terminals are mandatory. DM Sans Medium (500) for body text — clean and geometric. Scale: Hero 48px lineHeight 52 letterSpacing -1. Section Title 32px lineHeight 38. Card Title 22px lineHeight 28. Body 16px lineHeight 24. Never use Nunito for body text (too decorative at small sizes). Never use weights below 700 for any heading. includeFontPadding: false on all Nunito Text components for vertical centering in rounded buttons.

```css
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400&family=Nunito:ital,wght@0,700;0,800;0,900;1,700&display=swap');
```

Tailwind: `fontFamily: { display: ['Nunito', 'sans-serif'], body: ['DM Sans', 'sans-serif'] }`
Use it in an app
Create a free account to attach this style to a project: the hub adds it to the prompt your AI assistant gets, so it builds every page in this look.
Start building — freeI already have an account

From UI/UX Pro Max (MIT, commit 477bcb2).View source