Yellowbird®

Yellowbird® utilizes a high-contrast, playful aesthetic, rooted in an energetic yellow canvas and bold black typography. The system leans into strong visual boundaries with thick black outlines and defined shapes, avoiding subtle gradients or shadows. Typography, featuring custom display fonts, is a primary expressive element, varying dramatically in size and tracking to create a dynamic hierarchy. Components are chunky and direct, maintaining the brand's unapologetic visual presence through stark color blocking and distinct border treatments. Always use 'Yellowbird Yellow' (#ffe845) as the dominant background color for full-bleed sections, establishing brand identity immediately. Define all interactive area boundaries and critical visual separations with a 3px 'Midnight Black' (#000000) solid border. Prioritize Gooper at 91px for monumental headlines and ABC Monument Grotesk 400 for all navigation, headings (27-61px), and marketing copy, reserving Pitch Sans for body text. Implement tight letter-spacing for headlines and display text, specifically using negative tracking values like -0.0400em at 61px and -0.0280em at 91px. Apply 30px or 36px border-radius to cards and larger content blocks to soften the chunky design, contrasting with 0px radius on text inputs and some button variants for directness. Utilize 'Midnight Black' (#000000) for all primary text and secondary button backgrounds, ensuring high contrast against the bright yellow and white surfaces. Use 20px as a recurring padding unit for cards, buttons, and larger content blocks to create generous internal space. Avoid using gradients or drop shadows for elevation; rely on thick borders and color blocking to define dimensional relationships. Do not introduce subtle gray tones or desaturated colors outside of 'Warm Paper' (#fbfaf2); the palette is designed for high-contrast chromaticity. Never use type weights below 400 for any text; the system relies on bold, confident typography. Do not use white as a background for primary buttons or large content sections unless it is an internal element within a larger yellow or black block. Avoid using 'Electric Blue' (#007aff) for anything other than specific interactive accents or link highlights, never as a primary background or text color. Do not use letter-spacing values approaching normal (0em) for headings or large text; the system explicitly uses compressed tracking to maintain its distinctive look. Do not place text directly on top of visually noisy product imagery; always ensure content has a solid color background for legibility and to maintain the brand's graphic quality.