Recipes
Patterns are repeatable combinations of existing components. They describe composition without creating a second framework API.
Use Columns with a meaningful Figure and Content. Keep Figure first in source and reverse only the desktop layout when needed.
Apply Exhibit to Group or Card. Artwork remains decorative; Container or a content measure keeps the words readable.
Place Features in Grid. Use a fixed peer count and let the system collapse it for small screens.
Use Quote inside Grid, Track, or Marquee according to whether the collection is static, manually explored, or continuously moving.
Compose Card, Price, Checklist, Tooltip, and Buttons. Billing logic and plan data remain application concerns.
Use Scroll-Story when media and narrative must stay paired. Use ordinary Columns when sticky coordination adds no value.
The page studies combine real Artist components into complete, responsive pages. They use neutral placeholders and abbreviated copy so the composition stays legible. Each study includes a live viewport and implementation notes.
3 sections
A brand directory built around large editorial tiles, service introductions and supporting quotes.
2 sections
A focused newsletter landing page with one primary action and a large body of social proof.
10 sections
An illustrated narrative with alternating explanation sections, a product tour, testimonials and FAQs.
12 sections
The local Figma handover translated into default Artist compositions, not its bespoke CSS or obsolete offers.
Keep a composition as a recipe while its behavior can be explained with existing parts. Promote it only when it needs a stable, reusable contract of its own—such as shared markup, responsive behavior, accessibility rules, or JavaScript state.