Panic

Panic

Preview image. Unlock full-res

Vibrant type on contrasting canvas.

Industrymedia
Palette
#f8e2db
#0e1017
#16ffbd
#fff050
#ffffff
#000000

Panic Studio's design system combines bold, expressive typography with a vibrant, contrasting color palette. The visual identity alternates between a warm, soft peach background with dark text and a moody, dark background punctuated by energetic yellow headlines. Components are minimal, relying on generous spacing and high contrast to define their presence. The overall impression is playful yet authoritative, reflecting a creative agency that values strong visual storytelling. Use Panic Peach (#f8e2db) as the dominant background for light-themed sections, providing warmth. Pair Roslindale 500 headlines with GT Pressura 300 body text for consistent typographic contrast. Implement 60px border-radius for all interactive elements like buttons to maintain a soft, friendly aesthetic. Utilize Sunbeam Yellow (#fff050) exclusively for dramatic headlines or decorative graphical elements on dark backgrounds. Maintain generous 90px vertical section gaps and 50px horizontal column gaps to create a spacious, breathable layout. Employ Midnight Ink (#0e1017) for all primary text and un-filled button borders for strong contrast and legibility. Use Emerald Pop (#16ffbd) only for the brand logo or other specific brand marks, not for general UI elements. Do not use Roslindale for body text; reserve it entirely for headlines and display text. Avoid using Sunbeam Yellow (#fff050) as a button background color or for large blocks of text. Do not introduce square or low-radius corners on interactive elements; enforce 60px radius. Do not use multiple font families beyond Roslindale and GT Pressura without explicit approval. Avoid tight element spacing; prioritize the generous 12px element gap and larger section paddings. Do not use Emerald Pop (#16ffbd) for any interactive states or general background elements. Do not use gradients; the system relies on solid color blocks for structure and impact.

More like this