SayUI

Neobrutalism

Thick black borders, hard offset shadows, saturated flats—intentionally raw.

What it feels like

Like stickers slapped on the page — thick black edges, hard shadows, saturated blocks that refuse to whisper.

Why it works

Without soft blur, every shape reads at a glance; designed roughness is more memorable than polite gray UI.

How to tell AI

Neobrutalism: 2–3px pure black borders, hard offset shadow with no blur (e.g. 4px 4px 0 #000), saturated flats, bold type; skip gradients and frosted glass.

Signals

  • · 2–4px pure black stroke
  • · Hard offset shadow (no blur)
  • · Saturated flat fills
  • · Loud type, almost no gradients

Don't confuse with

Web brutalism leans browser-default ugliness; flat lacks hard shadow strokes; Y2K is chrome and gel, not hard stickers.

Style brief

Paste into your coding agent

Visual style: Neobrutalism.

Thick black borders, hard offset shadows, saturated flats—intentionally raw.

Defining signals:
- 2–4px pure black stroke
- Hard offset shadow (no blur)
- Saturated flat fills
- Loud type, almost no gradients

Do not confuse with: web-brutalism, flat-design, y2k.
Web brutalism leans browser-default ugliness; flat lacks hard shadow strokes; Y2K is chrome and gel, not hard stickers.

Implementation brief:
Use neobrutalism: thick black borders (2-3px), hard offset box-shadow with no blur (e.g. 4px 4px 0 #000), saturated flat colors, bold type, almost no gradients or glass. Buttons look like stickers.

Keep scope to visual language and components styling; do not redesign product information architecture unless asked.

Related patterns