Woven

Woven

Preview image. Unlock full-res

Artisanal parchment and charcoal calligraphy

Industryecommerce
Palette
#232323
#eeede5
#ffffff
#4a4a4a

Woven's design system evokes a refined, artisanal mood with a predominantly monochrome palette punctuated by subtle, natural off-whites. Typography is compact and precise, often uppercase with generous tracking, conveying a sense of heritage and meticulous craftsmanship. Components are lightweight and border-focused, with minimal use of shadows, emphasizing content over heavy UI chrome. The overall effect is understated luxury, where visual tension is created through careful spacing and material contrast rather than bold color or complex graphics. Use Parchment (#eeede5) as the default background for most page sections. Employ Carbon (#232323) for primary headings and body text, maintaining high contrast against light backgrounds. Apply all body text and secondary headings using 'Spezia Semi-Mono', emphasizing generous letter-spacing to enhance readability and establish a structured aesthetic. Utilize 0px border-radius for all primary interactive elements and most container edges to maintain a sharp, deliberate aesthetic. Ensure generous vertical spacing between sections, adhering to the sectionGap of 150px to create a spacious, breathable layout. Design interactive elements, especially navigation, as ghost buttons with transparent backgrounds and Carbon text, for an understated interface. Use 'Spezia' with normal letter spacing for large, impactful headlines to create visual differentiation from the monospaced UI text. Avoid strong, saturated colors; limit the palette to the established neutrals to preserve the brand's understated elegance. Do not use box-shadows or heavy elevation for cards or main UI elements; surfaces should appear flat or with subtle border delineations. Do not use generic system fonts; always prioritize 'Spezia Semi-Mono', 'Spezia', and 'Figtree' to maintain consistent brand typography. Do not introduce rounded corners for primary UI elements; maintain sharp, crisp edges unless a circular card variation is explicitly required for decorative purposes. Avoid dense, information-heavy blocks of text; break content into manageable sections with ample negative space. Do not add unnecessary padding to ghost buttons; they should remain lightweight and borderless without internal spacing.

More like this