Workable

Workable employs a direct and dynamic visual language, built on a clean canvas with a distinctive teal and dark forest green palette. Components are designed to be lightweight, with rounded corners that soften the strong typographic choices. Color is used purposefully for clear accents, interactive states, and to differentiate content blocks, while maintaining an overall sense of order and professionalism. The system balances functional clarity with subtle visual interest, avoiding heavy ornamentation. Use Proxima Nova for all text elements to maintain typographic consistency. Apply 16px border-radius to all cards and buttons for a unified, soft edge. Utilize Forest Canopy (#012620) for dark section backgrounds and Deep Teal (#004038) for primary action outlines or filled navigation buttons. Employ 32px padding for internal card content and around main section elements. Maintain an 8px elementGap between smaller UI components for comfortable dense layouts. Prioritize Canvas Porcelain (#fff5ee) as the primary page background to create a clean, light base. Use Fresh Teal (#00f5dc) and Soft Peach (#fde8ce) as background tints for cards to visually group or highlight content. Avoid arbitrary color usage; reserve brand and accent colors for functional roles or distinct highlights, not general decoration. Do not introduce complex shadows or extreme elevation; the design favors flat surfaces and subtle distinctions. Refrain from using overly decorative fonts; stick to Proxima Nova and Source Serif Pro for a clear, modern appearance. Do not deviate from the established 16px and 8px border-radii; random smaller or larger radii will break visual cohesion. Avoid dense, unbroken blocks of text; break content with headings, lists, and visual components. Do not use dark backgrounds for general page content; restrict them to hero sections or distinct visual breaks. Refrain from using system default link colors; ensure all links use either Midnight Ink (#0f161e) or Harbor Mist (#333942) unless an explicit accent link style is defined.