Anvil — Design, generated (minimal mono graphite CTA)

Summary

A quiet, monochrome graphite-on-paper SaaS landing whose star is a single centered CTA framed by registration marks, the kind of restrained design-tool moment that lets the headline and one button carry everything. It reads as a real page top to bottom: a frosted scrim sticky nav (a near-black graphite diamonds-four logo tile + 'Anvil' wordmark, five muted center links, a 'Log in' text link, a small dark 'Start designing' pill), then the full-bleed CTA section on a warm paper field with a faint dotted grain and soft top/bottom edge fades. The CTA is a max-w-760px quiet card (rounded-20px, near-transparent paper, a hairline border, a long soft inset+drop shadow) framed by four small corner registration ticks sitting just outside it, so it reads as a design artifact on a canvas. Inside, centered: a rounded-full hairline 'From prompt to pixel' eyebrow pill with a tiny pulsing graphite dot, a big Inter 560 headline 'Stop staring at the blank canvas.' (the last phrase carries a faint platinum gradient underline), a muted subhead, a single dark graphite primary pill 'Start designing free' with an arrow beside a quiet hairline-outline ghost 'Watch the canvas', and a three-item hairline-divided trust line (No credit card / Works in your coding agent / 57k designers and builders). The page closes on a full-bleed dark graphite footer (paper logo, four link columns, copyright, social icons, an 'All systems normal' status dot).

Style

A restrained, premium, monochrome design-tool aesthetic where a warm paper field and a single near-black graphite ink do all the work, with no color accent at all. The palette is grayscale-warm: a paper page #fbfbfa, near-black graphite ink #1c1c1e (with graphite shades 950 #1c1c1e, 900 #222224, 850 #28282b, 800 #2c2c2e) for text/buttons/footer, and a soft platinum #c7c7cc used only as a faint gradient underline hairline. Everything else is the same ink at low opacity (text at /70, /72, /80, borders at rgba(28,28,30,0.07-0.10), dividers at /12). There is no second hue: hierarchy comes entirely from ink-opacity steps, hairline borders, and soft shadow depth. One font does everything: Inter (weights 400-680 with OpenType features cv05, ss01, cv11 on), set tight with custom negative tracking (.tight -0.035em, .tighter -0.045em), the headline at weight 560 and a near-1.0 line-height. The look is quiet and crafted: a very faint radial dot grain on the canvas (rgba(28,28,30,0.045) dots at 26px), soft paper-to-transparent edge fades top and bottom of the section, a frosted scrim nav (paper/72 with saturate(140%) blur(10px)), generous rounding (a rounded-full eyebrow + buttons, a rounded-20px CTA card), and a signature design-tool flourish: four small corner registration-mark ticks framing the CTA card like artwork on a canvas. The single primary button is a near-black graphite pill that lifts 1px with a soft shadow on hover; the secondary is a transparent hairline ghost that just darkens its border. The mood is calm, confident and expensive, an infinite-canvas AI design agent that trusts one clear action and a lot of quiet space rather than color or noise.

Layout & Structure

A real framed landing page read as a calm vertical stack: a frosted sticky nav, a full-bleed paper CTA section that fills most of the viewport (min-h-[78vh]) and centers a single registration-mark-framed CTA card, then a full-bleed dark graphite footer. The nav, CTA, and footer all share a centered mx-auto max-w-[1180px] px-6 sm:px-8 column, while the CTA card itself narrows to max-w-[760px] and its subhead/trust copy to max-w-[470px]. It reflows cleanly to one column on mobile: the nav center links and 'Log in' hide (logo + 'Start designing' pill remain), the headline line-break and the trust-line vertical dividers hide (hidden sm:block / hidden sm:inline), the two CTA buttons stack full-width (flex-col -> sm:flex-row, w-full -> sm:w-auto), the card padding tightens (px-7 py-14 -> sm:px-14 sm:py-[88px]), the trust line wraps, and the footer grid goes from 12-col to 2-col with the bottom bar stacking.

Frosted scrim sticky nav

Full-bleed paper CTA section frame

THE STAR: registration-mark-framed CTA card

Eyebrow pill + tight headline

Subhead

Single primary pill + ghost secondary

Hairline-divided trust line

Full-bleed dark graphite footer

Special Notes

Palette is strictly monochrome-warm with NO color accent: paper #fbfbfa (page bg), graphite ink #1c1c1e (all text/buttons/footer; graphite shades 950 #1c1c1e, 900 #222224, 850 #28282b, 800 #2c2c2e), platinum #c7c7cc used only as a faint gradient underline and as inverted footer text/social. Everything else is the same ink at low opacity (text /70 /72 /80, borders .hairline rgba(28,28,30,0.10) and .hairline-soft rgba(28,28,30,0.07), dividers /12). Hierarchy is opacity + hairlines + soft shadow only, never a second hue. One Google font: Inter (weights 400;420;460;500;560;600;680) for everything, with font-feature-settings 'cv05' 1, 'ss01' 1, 'cv11' 1 and custom tight tracking (.tight -0.035em, .tighter -0.045em); the headline is font-[560]40/58px leading-[1.03] .tighter, body font-[420] 15.5/17px text-graphite-950/70. Icons are Iconify Phosphor: ph:diamonds-four-fill (logo, nav + footer), ph:arrow-right-bold (primary button), ph:play-circle (ghost button), ph:check-circle + ph:terminal-window + ph:users-three (trust line), ph:x-logo / ph:github-logo / ph:discord-logo (footer social). Custom utilities carry the look: .grain (radial dot texture at 26px), .hairline / .hairline-soft (the two border opacities), .scrim (frosted nav, saturate(140%) blur(10px) over paper/72), .tick (the 13px corner registration marks, border rgba(28,28,30,0.28)), .btn-primary (translateY(-1px) lift + soft shadow on hover over a .18s cubic-bezier), .btn-ghost (border-darken on hover), .nav-link (color darken on hover); plus the signature CTA-card shadow box-shadow: 0 1px 0 rgba(255,255,255,0.6) inset, 0 40px 80px -50px rgba(28,28,30,0.16) and a graphite ::selection (#1c1c1e on #fbfbfa). The signature language is a single centered CTA card framed by four corner registration-mark ticks on a faint dotted-grain paper canvas with soft edge fades, exactly one filled primary action beside a hairline ghost, and a full-bleed dark graphite footer as the only large dark block. To transfer the STYLE: keep paper + a single graphite ink + a faint platinum underline (no second color), the one tight Inter font with its OpenType features and negative tracking, hierarchy from ink-opacity + hairlines + soft shadow only, the dotted-grain canvas, the frosted scrim nav, and the calm generous quiet space. To transfer the LAYOUT: keep the framed stack (frosted sticky nav -> full-bleed min-h-[78vh] paper CTA section with soft edge fades, centering a max-w-[760px] registration-mark-framed CTA card: eyebrow pill -> tight headline with platinum underline -> subhead -> single graphite primary pill + hairline ghost -> hairline-divided 3-item trust line -> full-bleed dark graphite footer with brand blurb, three link columns, and a status-dot bottom bar). All copy avoids em-dashes; exactly one clear primary action.