Slopless Design

cta.scandinavian-soft-newsletter-nook · Newsletter nook

A cta pattern from Scandinavian Soft, drawn alone below with this design's tokens and sample copy. Used in this design on: home page, section 6. Give the section root data-pattern="cta.scandinavian-soft-newsletter-nook". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule

A rounded surfaceAlt panel on 1–12: headline at step 5 and a short line of body on its left half, the inline email form on its right half.

Slots

headline, body, newsletter

Grid areas

nook 1-12 (12-column grid, 1-based inclusive spans)

Tokens

bg #FDF9F4 · text #241E16 · heading #150E06 · accent #69A382 · accent2 #5DA29C · Nunito / Nunito Sans · radius 16px · space unit 8px (full list in design/tokens.json)

Pattern notes

A rounded panel in surfaceAlt across columns 1–12 (inside the page grid, never full-bleed), padded 96 px top and bottom: the headline at step 5, weight 400, and a lead-size muted line on the panel's left half, an inline email form vertically centred on 8–12. Phone: headline, line, form stacked.

Have a hard thing to explain?

Each engagement starts with a two-week audit: interviews with customers, sales and the people who build the product. The brief writes itself after that.

you@example.com