Give a month, get a month

Anyone who signs up through your link starts with 30 free days — and the same credit lands on your account when they do.

2 of 5 invites accepted 2 months credited

Two more and we upgrade you to Team for a year.

">

The prompt

Build a referral call-to-action with Tailwind CSS. Use a max-w-3xl rounded-2xl card with a neutral-900 left rail on md and up carrying a rotated or stacked label, or simply a two-part layout: a top block with a gift-like glyph tile, a heading reading "Give a month, get a month", and a supporting line explaining both sides get credit. Below, a copy row: a bordered rounded-xl field showing the referral URL in monospace with the domain part muted, and a dark Copy button on the right that swaps to a green Copied state. Under the row, three small share buttons for email, X and LinkedIn drawn as bordered pills with glyphs. Then a progress block: a label with invites accepted out of five, a thin neutral-100 track with a neutral-900 fill at forty percent, and a muted line saying two more unlock the next reward. Then add JavaScript that copies the link, flips the button state for two seconds, and selects the field text on click.

Paste it into Claude, Cursor, v0 or any AI coding tool. Prefer the finished markup? .