Marque

Loud brutalist studio: hard borders, yellow voltage, huge type.

Agency/marquelight + dark

Exemplar: Brutalist studio portfolios

Studied from hard-border studio sites. Original tokens and copy; no assets copied.

Live tokens

Colors

bg
#FFFFFF

surface
#F1F1EE

surface-alt
#E4E4DF

text
#0D0D0C

text-muted
#57574F

border
#0D0D0C

primary
#0D0D0C

on-primary
#FFFFFF

accent
#FFE500

on-accent
#0D0D0C

Type

Directionxxxl · 5rem

Design systemxxl · 3.25rem

Conversion notesxl · 2rem

Section headinglg · 1.375rem

Body copy for the pagemd · 1rem

Supporting textsm · 0.875rem

Meta labelxs · 0.75rem

Pack recipe 0123'Space Grotesk', 'Helvetica Neue', Arial, sans-serif

Pack recipe 0123'Geist', 'Inter', system-ui, sans-serif

Pack recipe 0123'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace

Spacing, radius, shadow

xs 0.25rem

sm 0.5rem

md 1rem

lg 1.5rem

xl 2.5rem

xxl 4rem

sm 0px

md 0px

lg 0px

Component samples

Brands that refuse to blend in

Identity systems for loud companies.

Blunt claim.

Now booking Q2

Company

One line is enough.

Volt Energy

Rebrand + packaging

Result: 2.1x shelf recall

Recipe

Apply the rules, place the patterns, then tune the conversion notes against the rubric.

Rules

Set display type at the largest size the grid allows.
Draw every boundary with a 1px black border.
Use yellow as a highlighter block, never as text color.
Alternate black and white sections for rhythm.
Keep copy blunt: nouns and numbers over adjectives.

Patterns

Poster hero: one statement, edge to edge.
Case cards in a bordered grid with mono meta rows.
Marquee strip of client names between sections.
Big footer with the enquiry address at display size.

Conversion notes

Name the outcome in numbers on each case card.
Keep one enquiry action, repeated at every scroll depth.
State the engagement model: sprint, retainer, or project.

See this pack on your site.

Attach your URL. The audit maps your gaps to Marque or a better-fit pack.