> ## Documentation Index
> Fetch the complete documentation index at: https://help.21st.dev/llms.txt
> Use this file to discover all available pages before exploring further.
# Monetization & Promotion
> Sell templates and get hired, tipped, or sponsored from your profile.
21st.dev doesn't process payments on your behalf — there's no in-app checkout or payout system. Instead, every monetization feature works the same way: you drop in a link to a service you already use (a checkout page, a booking page, a donation platform), and 21st.dev surfaces it to the right audience at the right moment. This page covers all of them.
**Components stay free.** There's no price field on individual components — monetization applies to **templates** (one-time paid listings) and to blocks on your **public profile** (hire, donate, pro catalog). If you want to sell a component-like product, package it as a template instead.
## Sell a Template
Templates are the only catalog item that supports a price. Each template has its own **Price** and **Buy / download URL**.
In Studio, go to your **Templates** list and open (or create) the listing.
Enter a **Price (USD)**. Leave it at `0` to keep the template free.
Set **Buy / download URL** to wherever the purchase actually happens — your own Gumroad/Lemon Squeezy/Stripe Payment Link, or a page on your own site.
**21st.dev never touches the money.** There's no built‑in checkout, no Stripe integration on templates, and no payout system. When a visitor clicks buy, they see a disclaimer confirming they're leaving 21st.dev, then get redirected to your **Buy / download URL** to complete the purchase on your own site or storefront. You're responsible for delivery, receipts, and refunds.
If your buy link already carries an affiliate/referral parameter for a third-party vendor (for example a template marketplace that pays you `?via=yourname`), set that same URL as your **Pro components link** (see below) — 21st.dev automatically appends your referral parameter to that template's buy link so you still get credit.
## Components Are Free-Only
There is currently no price field, checkout, or paid tier for individual components — only templates carry a price. If you want to monetize component-style work, publish the free version to build reach, and link your paid catalog using the **Pro components** block below.
## "Work with Me" Block
A hire-and-contact card that renders on your public profile (`21st.dev/@you`). Configure it in **Studio → Profile → Work with me**.
Fields (all optional — the block only appears once at least one is filled in):
| Field | What it does |
| -------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Headline** | Defaults to "Work with me" if left blank. |
| **Pitch** | One short paragraph under the headline (280 chars), e.g. "Available for freelance and contract work." |
| **Hire link** | A booking or contact link — cal.com, Calendly, your contact form, etc. |
| **Button label** | Overrides the CTA button text. Defaults to "Work with me". |
| **Contact email** | Adds a separate Email button. |
| **Right-side media** | Choose **None**, a built-in **preset** graphic, an uploaded **image/GIF**, or one of your own **published components** to display beside the block. |
## Get Tipped or Sponsored
A "Support" block for one-time tips or recurring sponsorship. Configure it in **Studio → Profile → Donation** by pasting a **Donation link**.
Only links to known donation platforms are accepted:
Liberapay, Boosty, Stripe Payment Links (`buy.stripe.com` / `donate.stripe.com`), and Lemon Squeezy links are also accepted even though they're not called out in the field's helper text.
When a visitor clicks **Support**, they see your avatar, bio, and stats, then confirm a disclaimer ("21st.dev doesn't process payments or issue refunds") before being redirected to your donation platform in a new tab. The tip itself happens entirely on that platform — 21st.dev only surfaces the link and shows a click count in your Studio analytics.
## Link Your Premium Catalog ("Pro Components")
If you sell components or templates elsewhere — your own shop, a template marketplace, a Gumroad store — add that link under **Studio → Profile → Pro components**. It renders as a **"Pro components"** block on your profile pointing at your premium catalog.
If this URL includes a referral/affiliate query parameter (e.g. `?via=yourname`), 21st.dev reuses it: any affiliate parameter found in your Pro components link is automatically appended to your own templates' buy links, so a template sale you drive through 21st.dev still credits your referral.
## Arrange the Blocks
**Studio → Profile → Layout & visibility** controls which of the four profile blocks (**Featured**, **Work with me**, **Pro components**, **Donation**) are shown and in what order. Toggle any block off if you'd rather not display it, and drag to reorder — for example, put **Work with me** above **Donation** if you'd rather visitors hire you before they tip you.
## What's Not There (Yet)
* No price/checkout on individual components — templates only.
* No in-app payments, invoicing, or payout system for anything on this page — every flow above ends with an outbound redirect to a service you control.
* The platform membership plan (the "supporters" count shown on [21st.dev/pricing](https://21st.dev/pricing)) is about supporting 21st.dev itself, not a way to receive money as an individual author — use the **Donation** block for that.