Preview image. Unlock full-res
Joyful Quilted Canvas
MA Quilts employs a vibrant, handcrafted aesthetic with a focus on bold typography and a playful, primary color palette. The design balances generous white space with striking color blocks and outlined interactive elements. Typography is confident and uppercase for headlines, creating a distinct visual voice, while subtle dashed borders and high radius buttons add a touch of playful warmth.
Use Accent Orange (#f15a24) exclusively for primary interactive elements, major headings, and brand accents.
Maintain a clear visual hierarchy by employing Manrope for all headings with appropriate letter-spacing, and Roboto Mono for body and supporting text.
Apply a 66px border-radius to all buttons for a consistent soft, pill-like appearance.
Implement dashed borders (e.g., 4px dashed) for subtle visual divisions or decorative elements, particularly around image cards.
Utilize Canvas White (#ffffff) as the dominant background, balanced with Canary Yellow (#ffed8c) for distinct section breaks or focused content blocks.
Ensure generous spacing around all components; an elementGap of 14px is a good default.
Adopt an uppercase style for all significant headings using Manrope to reinforce the system's bold typographic identity.
Do not introduce new primary action colors; Accent Orange (#f15a24) serves this role through its outlined usage.
Avoid using solid background fills for buttons; prefer the outlined style with Accent Orange borders.
Do not deviate from the Manrope and Roboto Mono font families for text content.
Avoid tight spacing between elements; maintain adequate elementGap and cardPadding to prevent a cramped appearance.
Do not use shadows for elevation; the design system relies on color blocks, borders, and spacing for visual hierarchy instead.
Do not use generic system fonts; always specify Manrope or Roboto Mono.
Avoid using full-bleed imagery without surrounding white space; images should feel contained within the layout.
