Faire ES

Faire ES

Preview image. Unlock full-res

Warm artisanal marketplace.

Industryecommerce
Palette
#fbf8f6
#ffffff
#000000
#333333
#dadada
#6c6a6a
#f1f29f
#757575

Faire presents a warm, artisanal marketplace aesthetic, balancing utility with a handcrafted feel. Predominantly light surfaces provide a clean backdrop for product showcases, punctuated by a soft, moderate yellow that adds a unique brand signature. Typography combines a sturdy sans-serif for functional text with a distinct serif for headlines, creating an approachable yet authoritative voice. Component shapes exhibit soft, approachable corners, reinforcing the friendly marketplace identity. Use Market Yellow (#f1f29f) sparingly for illustrative highlights or soft decorative elements, not for interactive states. Apply Graphik weight 400 for all body text and UI labels, ensuring consistent readability across the interface. Reserve the nantes typeface exclusively for prominent headlines (22px to 52px), leveraging its distinctive serif character. Maintain a default border-radius of 4px for all cards, buttons, and visual containers, providing a subtle softness. Utilize Ink Black (#000000) for primary CTAs to create a strong, clear intention, paired with Surface White (#ffffff) text. Employ Canvas White (#fbf8f6) as the base page background, providing a subtle, warm off-white canvas. Ensure button padding consistently uses horizontal values of 23-24px and no vertical padding, maintaining a compact appearance. Do not use Market Yellow (#f1f29f) for actionable elements like buttons or links; it is a decorative accent. Avoid using multiple font weights within a single text element; stick to the defined weights for Graphik (100, 400) and nantes (400). Do not apply sharp 0px corners to interactive elements; maintain a minimum 4px radius for a consistent, approachable feel. Never use full-width sections without horizontal padding; ensure a minimum 48px left and right padding on large screens. Avoid using a border on product images unless it serves a specific functional purpose; let the image content stand out clearly. Do not apply excessive box-shadows or elevation. The system favors subtle borders and flat surfaces for depth. Refrain from using saturated colors other than Market Yellow; the palette is predominantly neutral with functional semantic color sparingly applied.

More like this