
Preview image. Unlock full-res
Architectural grid on frosted glass
Tripolis-Park embodies a confident-minimalist design language, characterized by a predominantly achromatic palette with only subtle background shifts. Typography is the primary conveyor of hierarchy and brand attitude, employing a mix of strong, impactful display fonts and versatile body text. Components are lightweight, often ghosted or outlined, emphasizing content and space rather than heavy ornamentation. The visual system prioritizes clarity and directness, letting information and subtle background textures speak for themselves. Use Midnight Ink (#000000) for all primary text, headings, and distinct borders. Maintain Canvas White (#ffffff) as the dominant background color for most page sections, and for ghost button text/borders on dark backgrounds. Apply Matter-Regular (400) for body text and interactive elements, ensuring 'tnum' font feature settings are enabled for numerical consistency. Reserve IvarHeadline-Medium (400) at 47px for main section headings, with letter-spacing of -0.0150em or -0.0100em to establish a strong, but restrained, visual hierarchy. Employ a 0px border-radius for most UI elements like buttons, adhering to a sharp, modern aesthetic, unless explicitly defined as circular (50%). Separate content blocks and sections with a consistent 64px vertical gap where content transitions are visually distinct. Ensure all interactive text and ghost buttons have transparent backgrounds, with their color and border adapting to the underlying section's lightness. Do not introduce strong chromatic colors for backgrounds or primary UI elements outside of the hero gradient. Avoid using heavy shadows or distinct elevation styles; prefer subtle background color shifts or thin borders for visual separation. Do not deviate from the Matter and IvarHeadline font families; these are central to the brand's typographic identity. Do not use generic button styles; stick to the ghosted/outlined or circularly-bordered variants seen in the components section. Do not apply padding directly to button elements; allow the content and context to define its interactive area, or refer to button component variants. Avoid inconsistent horizontal spacing; adhere to the established element gaps like 5px, 10px, 18px where present. Do not use letter-spacing on Matter-Regular body text; it should generally use 'normal'.









