Subset

Subset

Preview image. Unlock full-res

Organic Canvas, Understated Authority

Industryecommerce
Palette
#f5f4ee
#241f20
#ffffff
#808080
#000000
#233735
#6487ba
#8bbd78
#ff965b
#edcdc2
#5b7763
#27293d

Subset embraces a grounded, natural aesthetic, combining the tactile feel of organic materials with a clean, unadorned interface. The visual design prioritizes clear product presentation against a muted, almost oatmeal-colored canvas, punctuated by utilitarian typography and a few carefully chosen, moderately saturated accent colors. Components are minimal and unfussy, focusing on function over adornment, embodying a sense of reliable simplicity. Color is used sparingly, primarily to distinguish states or add a subtle brand signature rather than for bold visual statements. Prioritize FoundersGrotesk for all functional text, ensuring precise letter-spacing at different scales to maintain a compact, legible feel. Use TTRamillas_Light for all marketing headlines; its light weight and negative tracking provide an elegant contrast. Maintain a strict 0px border-radius for all component cards, badges, and primary/secondary buttons to preserve the structured, unadorned aesthetic. Apply Oatmeal Canvas (#f5f4ee) as the primary background for all static content areas, grounding the interface in a natural, soft tone. Use Deep Forest (#233735) for filled primary action buttons and Mineral Blue (#6487ba) for secondary actions; these are the core chromatic accents. Separate content sections with ample vertical spacing (64px sectionGap) for visual breathing room, avoiding horizontal dividers between major content blocks. Employ a 50% border-radius for all circular interactive elements and small ghost buttons, creating distinct visual cues. Avoid using drop shadows on any components; the system relies on flat surfaces and clear borders for definition. Do not introduce new typefaces; FoundersGrotesk and TTRamillas_Light are the only approved fonts. Refrain from using gradients for backgrounds or components; the design emphasizes flat, solid colors. Do not use saturated chroma for general text or borders; stick to the neutral palette for UI elements to maintain a muted appearance. Avoid decorative icons or illustrations that are not rendered in Spring Bud (#8bbd78) or Sunset Orange (#ff965b); color accents are reserved and intentional. Do not deviate from the specified padding and margin values; the compact density is carefully calibrated. Never use box-shadow for elevation, as this design system eschews overt layering effects.

More like this