Frontify

Frontify

Preview image. Unlock full-res

Architectural blueprint on soft linen

Industrydesign
Palette
#111110
#f0f0eb
#ffffff
#e1e1db
#d7d7cf
#464643
#000000
#cbcbc5
#bfbfb8
#575753
#042a2b
#ff3b00

Frontify employs a sophisticated, clean, brand-centric aesthetic, combining a calm, off-white canvas with sharp black typography and deliberate, functional infusions of color. The system balances highly compact, precise type with generous negative space, creating an impression of clarity and efficiency. A muted, almost monochrome palette ensures focus on content, with specific, vivid accents used strategically for highlighting interactive elements or brand punctuation. Components are lightweight with softened corners, contributing to a modern, approachable feel. Always use Paper White (#f0f0eb) as the default page canvas, creating a consistent light background. Apply ABC Diatype for all body text and UI labels, ensuring clarity and efficiency with its 0.0100em letter spacing. Reserve Cranny font for headlines and display text, leveraging its elegant weight 300 or 400 with size-dependent letter spacing for sophisticated visual hierarchy. Button corners should consistently have a 24px border-radius for primary and outlined buttons, and 40px for larger tertiary buttons, maintaining a soft, approachable feel. Utilize Inkwell Black (#111110) for primary button backgrounds and primary text, creating high contrast and clear calls to action. Implement a default element gap of 8px for vertical and horizontal spacing between small UI elements, establishing a comfortable density. Card backgrounds should default to Canvas Muted (#e1e1db) with an 8px border-radius, providing subtle visual separation without heavy borders or shadows. Avoid using multiple chromatic colors for interactive elements; stick to Flame Orange (#ff3b00) or Violet Streak (#b60ae3) for accents, never for full button fills. Do not use heavy shadows or multi-layered elevation; surfaces are defined by subtle background changes and light borders, not Z-axis depth. Do not use default system fonts; ABC Diatype, Cranny, Satoshi, and Cabinetgrotesk are the only approved typefaces. Avoid arbitrary letter spacing; use the defined -0.007em (for large Cranny) or 0.010em (for ABC Diatype) for precise type rendering. Do not introduce new border-radius values; adhere strictly to 4px, 8px, 18px, 24px, 32px, and 40px for components as specified. Never use less than 48px vertical spacing between major page sections to maintain a spacious and breathable layout. Do not introduce new accent gradients. The 'Gradient Aura' provides a controlled, decorative element that should not be replicated or modified.

More like this