Neobrutalism vs Playful Color

Awesome Design Skills · Design Taste by Mustafa

Tied at 4/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 Maximalist way: loud color, big type, more is more. Both are best for: visual direction.

Neobrutalism4/5
After: Tally landing page, made with Neobrutalism (Awesome Design Skills)
Playful Color4/5
After: Tally landing page, made with Playful Color (Design Taste by Mustafa)

Scroll either page; the other follows.

Neobrutalism puts Tally on warm off-white with thick navy borders, hard offset shadows and flat yellow and violet blocks. The landing has a CSS phone with sticker-like envelope cards; the dashboard uses a dotted background, yellow highlights on the date and summary cards, and a clean transactions table. It is bold but still easy to read on both pages. Pick it for playful products that want a confident, graphic look.

Playful Color gives Tally a poster: heavy Bricolage Grotesque headlines with "a job" on a tilted cobalt block, a dotted cobalt and yellow panel behind the app card, and sections that switch between full cobalt, black and yellow. The dashboard keeps it going with a black sidebar, a huge "October is on track" headline, a cobalt "$640 left" card with an "Assign it" sticker and a black-and-yellow striped bar for the over-budget envelope. Two colors are used with discipline and both pages hold up on a phone; a bill notice in the hero covers one envelope row. Pick it for consumer, education or event products that want energy.

Side by side

FieldNeobrutalism (Awesome Design Skills)Playful Color (Design Taste by Mustafa)
Fonts
  • Inter
  • JetBrains Mono
  • Bricolage Grotesque
  • JetBrains Mono
Colors
  • #fbfbf9 off-white
  • #1c293c ink navy
  • #fdc800 yellow
  • #432dd7 violet
  • #ff8fb1 pink (dashboard)
  • #16a34a green
  • #fdf6ec cream
  • #2e4bff cobalt
  • #ffd100 banana yellow
  • #101014 ink black
Pick it for
  • playful SaaS landing pages
  • consumer finance and productivity apps
  • product dashboards
  • startup marketing sites
  • D2C brands
  • consumer apps
  • education and youth products
  • events
Skip it for
  • conservative brands
  • luxury products
  • very dense admin tools
  • quiet premium brands
  • conservative finance
Observations
  • dashboard: the pink and violet chart bars add colors that are not in the rest of the system
  • the run did not check the page in a browser, but our screenshots show no breakage
  • a bill notice in the hero covers the Rent row

How the brief works

Install Neobrutalism (Awesome Design Skills)

1 Run in your terminal

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

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 Playful Color (Design Taste by Mustafa)

1 Run in your terminal

npx degit madebymustafa/design-taste/skills/playful-color#main .claude/skills/playful-color

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.