Freitag

Freitag's design system uses a utilitarian, recycled canvas aesthetic: dominant light gray surfaces, stark black typography, and highly functional component treatments. The visual style emphasizes content clarity and product-focused imagery, punctuated by vibrant, raw material colors within the product compositions themselves. The layout maintains a controlled maximum width, creating a structured, gallery-like experience for showcasing unique items. Use Silver Foam (#cacaca) as the primary page background color for all main content areas. Apply Ink (#000000) for all primary body text, headings, and interactive elements to maintain high contrast with light backgrounds. Ensure all buttons utilize a 9999px border-radius to achieve a consistent pill shape for interactive elements. Maintain high stroke contrast (1px Ink #000000 or Graphite Outline #404040) for borders on all primary UI elements and interactive components. Implement AkkStdRg for all headings at appropriate scale sizes and FRg for small, functional text like button labels, ensuring distinct typographic roles. Structure page content within a 1200px pageMaxWidth, centered, to provide a structured, gallery-like presentation. Utilize a 22px margin or padding around sections and a 12px margin for elements to define clear content separation. Avoid chromatic colors for primary UI elements like backgrounds or main text; reserve them for product imagery and accents. Do not introduce new border-radii values; strictly adhere to 0px, 4px, 12px, 16px, or 9999px as defined. Never use soft, low-contrast shadows; only apply the defined 2px 2px 10px 0px rgba(0, 0, 0, 0.12) shadow to specific elevated actions. Do not deviate from the specified font families and their respective letter-spacing values to preserve the brand's typographic tone. Avoid full-bleed layouts; always respect the 1200px content constraint to maintain visual discipline. Do not use generic system fonts for branding or impactful headlines; AkkStdRg and FRg are crucial for brand identity.