Contemporary vs Mobile App UI Design

Awesome Design Skills · Standalone skill

Tied at 3/5 on the same brief. Pick by fit: the rows below show where each one is stronger.

Both built the Tally landing page in the same Claude Code test, and both design the Daydreamer way: pastel gradients, frosted glass and rounded everything. Software that feels like a nice day.

Contemporary3/5
After: Tally landing page, made with Contemporary (Awesome Design Skills)
Mobile App UI Design3/5
After: Tally landing page, made with Mobile App UI Design

Scroll either page; the other follows.

Contemporary gives Tally a white page with magenta-to-pink gradient accents, Jost type and a bento grid of feature tiles. The dashboard leads with a gradient "$640 left to budget" card over light tiles. It is clean and current, and the magenta keeps it from looking like the default. Pick it for modern consumer or creator products.

The mobile app UI skill gives Tally an app-first look: Manrope on off-white, a green accent with sun, clay and sky category colors, and big rounded cards. Both pages work well on a phone, and the dashboard in Plus Jakarta Sans matches. Pick it if mobile is where your users live.

Side by side

FieldContemporary (Awesome Design Skills)Mobile App UI Design
Fonts
  • Jost
  • Overpass Mono
  • Manrope (landing)
  • Plus Jakarta Sans (dashboard)
Colors
  • #ffffff white
  • #f4f3f7 lilac grey
  • #c800df magenta
  • #e60076 pink
  • #111827 ink
  • #15803d green
  • #f7f5f0 canvas
  • #16201c ink
  • #14805e green
  • #f2b544 sun
  • #e07a5f clay
  • #5b8def sky
Pick it for
  • modern consumer apps
  • creator and social products
  • SaaS landing pages
  • bento-style dashboards
  • mobile-first products
  • app marketing sites
  • consumer apps
  • onboarding flows
Skip it for
  • conservative finance brands
  • enterprise tools
  • editorial sites
  • editorial sites
  • bold brands
  • dense desktop tools
Observations
  • the magenta gradient is the only strong idea; the rest is a standard bento layout
  • only slight distance from the baseline palette

How the brief works

Install Contemporary (Awesome Design Skills)

1 Run in your terminal

npx degit bergside/awesome-design-skills/skills/contemporary#main .claude/skills/contemporary

2 Or paste a prompt into Claude Code, Codex, Cursor or Gemini

It tells your tool to install this from its source repository.

This install is for Claude Code only; for other agents use Copy prompt or copy the skill folder.

Copies just this skill's folder into your project's .claude/skills.

Check the source for the latest instructions.

Install Mobile App UI Design

1 Run in your terminal

npx skills add ceorkm/mobile-app-ui-design

2 Or paste a prompt into Claude Code, Codex, Cursor or Gemini

It tells your tool to install this from its source repository.

Taken from the project README. Check the source for the latest instructions.