Referral Banner
A muted row with a gift icon square, a give and get lead with reward terms, a mono referral link field, and a copy button.
A muted row with a gift icon square, a give and get lead with reward terms, a mono referral link field, and a copy button.
The source for every Marketing block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Referral Banner puts a share link in front of a happy customer at the moment it matters. A rounded muted row opens with a Gift icon square, carries a bold give and get lead followed by the reward terms in muted text, and closes with the personal referral link in a mono field beside a Copy button. The mono field reads as something to lift and share, and the copy action sits right next to it so the whole exchange is one click.
The markup is static, so the banner renders as a server component with no client code out of the box. Wire the Copy button to the clipboard in your app to make it live, and swap the rest freely: rewrite the give and get lead, edit the reward terms, and drop in each member's own link. The muted surface keeps it inline, so it sits between sections without reading as an interruption.
Reach for this block on surfaces a satisfied member already trusts, an account page, an order confirmation, or a thank you after an upgrade. It works because it asks for a share when goodwill is highest and makes the reward mutual, so the person passing the link gains as much as the friend who takes it. Keep the terms plain and symmetrical so the offer reads as a favor rather than a pitch.
A natural flow around it on a Marketing Pro page:
Before
After
The obvious fit is a give a month, get a month link. A few other ways to use the frame:
Tip: name what both sides get in the lead, a mutual reward shares far better than a one sided credit that only pays the sender.