Raw Grid
Raw Grid — Neo-brutalist deck with thick borders, offset shadows, and a pink/sage/ink palette. Segoe UI / system-ui typography. white background with ink-black structure, soft pink and sage green as flat colo. Best for startup pitch, accelerator demo day, founder pitch. AI-ready design system.
Use case: startup pitch, accelerator demo day, founder pitch, indie product launch, brand deck, creator portfolio
Historical Context
Brutalism in graphic design didn't emerge from laziness — it was a deliberate rejection of the polished, corporate-sanitized interfaces that dominated the early 2010s. Designers were suffocating under flat design's beige uniformity, and brutalism said: show the structure, expose the grid, stop pretending software is a magazine spread. The neo-brutalist wave that followed — thick borders, raw grids, offset shadows in confrontational colors — owes as much to zine culture and punk typography as it does to Béton brut architecture. It's the visual language of people who build things in public and refuse to sand down the edges. The pink offset shadow specifically became a signature move around 2019-2021, a way to inject irreverence without losing legibility. What makes Raw Grid interesting is that it takes the brutalist ethos and gives it just enough system to be usable at scale. It's not chaos cosplay — it's structured rebellion. The grid is visible because the grid IS the design.
When to Use
When your brand needs to feel like it was built by humans who have opinions. Creative studios launching portfolio sites, indie SaaS products that want to stand out from the Stripe-clone sea, agencies pitching to clients who are tired of safe. Works best when content is king and you want the container to feel honest rather than decorative. Terrible for healthcare, banking, or anything where trust requires visual conservatism.
Design Principles
- Borders are structural, not decorative — use them at 2-4px to define hierarchy, not to ornament
- Offset shadows replace elevation — shift 4-8px in a single accent color, never blur them
- The grid is visible and intentional — gaps, tracks, and alignment are part of the aesthetic, not hidden infrastructure
- Color is confrontational but limited — one high-saturation accent against monochrome, never a gradient
- Typography does the heavy lifting — oversized, tight-tracked headings paired with readable mono or grotesque body text
Technical Specs
Colors
Primary
Secondary
Effects
display font Segoe UI / system-ui for hero headlines, bold hover color shift (150ms), high-contrast active states, 3px black offset shadows, pink/sage ink palette, neo-brutalist card borders, dense grid, compact 1.2rem gaps
Light/Dark
✓ Full / ✗ None
Related
Last synced: 5/6/2026