> ## Documentation Index
> Fetch the complete documentation index at: https://beta-docs.replo.app/llms.txt
> Use this file to discover all available pages before exploring further.

# Prompt Library

> Ready-to-run prompts for launches, sales, listicles, quizzes, and more.

export const TryPromptButton = ({prompt, imageSrc, imageAlt = "Template preview", imageStyles = {}, buttonCta = "Build in Replo"}) => {
  const [isLoading, setIsLoading] = useState(false);
  const [error, setError] = useState(null);
  const API_BASE = "https://api.replo.app";
  const APP_URL = "https://dashboard.replo.app";
  const LoaderIcon = <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" style={{
    animation: "spin 1s linear infinite"
  }}>
      <path d="M21 12a9 9 0 1 1-6.219-8.56" />
    </svg>;
  const ChevronIcon = <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
      <path d="m9 18 6-6-6-6" />
    </svg>;
  async function postJSON(url, body, headers = {}, timeoutMs = 120000) {
    const controller = new AbortController();
    const timeoutId = setTimeout(() => controller.abort(), timeoutMs);
    try {
      const response = await fetch(url, {
        method: "POST",
        headers: {
          "Content-Type": "application/json",
          ...headers
        },
        body: JSON.stringify(body ?? ({})),
        signal: controller.signal
      });
      const responseText = await response.text();
      if (!response.ok) throw new Error(`API Error: ${response.status}`);
      return responseText ? JSON.parse(responseText) : {};
    } finally {
      clearTimeout(timeoutId);
    }
  }
  async function handleTryPrompt(event) {
    event.preventDefault();
    event.stopPropagation();
    setIsLoading(true);
    setError(null);
    try {
      const body = {
        prompt,
        file: null
      };
      const {seed} = await postJSON(`${API_BASE}/api/v1/marketing/issue-marketing-site-jwt`, body);
      if (!seed) throw new Error("No seed returned from API");
      const url = new URL(APP_URL);
      url.searchParams.set("type", "agent");
      url.hash = `seed=${encodeURIComponent(seed)}`;
      window.open(url.toString(), "_blank");
      setIsLoading(false);
    } catch (caughtError) {
      console.error("Failed to generate prompt:", caughtError);
      const message = caughtError instanceof Error ? caughtError.message : null;
      setError(message ?? "Something went wrong. Please try again.");
      setIsLoading(false);
    }
  }
  return <div style={{
    position: "relative",
    display: "inline-block",
    width: "100%"
  }}>
      {}
      {imageSrc && <img src={imageSrc} alt={imageAlt} style={{
    width: "100%",
    height: "auto",
    display: "block",
    borderRadius: "8px",
    opacity: 0.8,
    ...imageStyles
  }} />}

      {}
      <div style={imageSrc ? {
    position: "absolute",
    top: "50%",
    left: "50%",
    transform: "translate(-50%, -50%)",
    zIndex: 10
  } : {
    display: "flex",
    justifyContent: "flex-start",
    margin: "1.25rem 0"
  }}>
        <button type="button" className="try-replo-btn" onClick={handleTryPrompt} disabled={isLoading} style={{
    backgroundColor: "#274AE2",
    color: "#ffffff",
    padding: "0.5rem 1.1rem",
    fontSize: "0.875rem",
    fontWeight: 600,
    fontFamily: "inherit",
    border: "none",
    borderRadius: "9999px",
    cursor: isLoading ? "not-allowed" : "pointer",
    lineHeight: 1.4,
    whiteSpace: "nowrap",
    display: "inline-flex",
    alignItems: "center",
    justifyContent: "center",
    WebkitFontSmoothing: "antialiased",
    boxSizing: "border-box",
    opacity: isLoading ? 0.7 : 1,
    boxShadow: "0 1px 2px rgba(15, 23, 42, 0.08)",
    transition: "background-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease"
  }}>
          <span style={{
    visibility: isLoading ? "hidden" : "visible",
    display: "inline-flex",
    alignItems: "center",
    gap: "0.375rem"
  }}>
            {buttonCta}
            {ChevronIcon}
          </span>
          {isLoading && <span style={{
    position: "absolute",
    display: "inline-flex",
    alignItems: "center",
    justifyContent: "center"
  }}>
              {LoaderIcon}
            </span>}
        </button>
      </div>

      {}
      <style>
        {`
          @keyframes spin {
            from {
              transform: rotate(0deg);
            }
            to {
              transform: rotate(360deg);
            }
          }
          .try-replo-btn:hover:not(:disabled) {
            background-color: #1f3ec0 !important;
            box-shadow: 0 4px 12px rgba(39, 74, 226, 0.35);
            transform: translateY(-1px);
          }
          .try-replo-btn:active:not(:disabled) {
            transform: translateY(0);
            box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
          }
          .try-replo-btn:focus-visible {
            outline: 2px solid #274AE2;
            outline-offset: 2px;
          }
        `}
      </style>

      {}
      {error && <div style={{
    marginTop: "12px",
    padding: "12px 16px",
    backgroundColor: "#fee",
    border: "1px solid #fcc",
    borderRadius: "6px",
    color: "#c33",
    fontSize: "14px",
    textAlign: "center"
  }} role="alert">
          {error}
        </div>}
    </div>;
};

This library gives you proven prompts for **paid traffic landing pages, sales funnels, and high-converting campaigns**. Each prompt is designed with performance in mind, use them to ship faster, test more, and improve unit economics.

Copy these directly into Replo or adapt them to your campaign goals, traffic source, and conversion objectives.

***

## Product Launch Pages

**When to use:** Launching a new product with paid social traffic. Goal is to maximize [CVR](/glossary#cvr) on first-time visitors and validate [CAC](/glossary#cac) targets.

**Why it works:** Dedicated launch pages convert 3-5x better than generic product pages because they're built for a single conversion action.

```text theme={null}
Build a product launch landing page for [PRODUCT_NAME].

Traffic source: Paid social (Meta ads, cold audience).
Goal: 5%+ CVR to hit $40 CAC target.

Page structure:
- Hero: Product image + headline emphasizing key benefit + subhead with social proof ("Join 5,000+ customers")
- 3-benefit section with icons (keep benefits to one sentence each)
- Before/after visuals or results-focused images
- Testimonials (5 reviews, grid layout)
- FAQ (4 questions, collapsed accordion)
- Single CTA throughout: "Shop Now"

Match my brand colors and optimize for mobile, 70% of traffic is mobile.
```

<TryPromptButton
  prompt={`Build a product launch landing page for a lavender soy candle.

Traffic source: Paid social (Meta ads, cold audience).
Goal: 5%+ CVR to hit $40 CAC target.

Page structure:
- Hero: Product image + headline emphasizing key benefit + subhead with social proof ("Join 5,000+ customers")
- 3-benefit section with icons (keep benefits to one sentence each)
- Before/after visuals or results-focused images
- Testimonials (5 reviews, grid layout)
- FAQ (4 questions, collapsed accordion)
- Single CTA throughout: "Shop Now"

Match my brand colors and optimize for mobile, 70% of traffic is mobile.`}
/>

***

## Seasonal Sale Pages

**When to use:** Running time-sensitive promotions (Black Friday, Q4, flash sales) where urgency and [AOV](/glossary#aov) optimization are critical.

**Why it works:** Sale pages with urgency convert 20-40% better than evergreen pages. Focus on bundles and volume offers to maximize [AOV](/glossary#aov).

```text theme={null}
Build a Black Friday landing page for [PRODUCT_CATEGORY].

Traffic source: Retargeting campaign (warm audience, 30-day window).
Goal: 6%+ CVR and increase AOV from $65 to $95+ with bundle offers.

Page structure:
- Hero: Bold discount headline "40% Off Sitewide" + countdown timer (ends Sunday 11:59 PM EST)
- Featured bundle section: "Complete Set, Save 50%" with single product bundle at $95 (normally $190)
- Bestsellers grid: 6 products, show original price + sale price
- Trust section: Free shipping, 30-day returns, 10K+ 5-star reviews
- FAQ: 3 questions about the sale (shipping cutoffs, return policy, discount stacking)
- Single CTA: "Shop Now"

Optimize for mobile, TikTok traffic. Keep page fast and focused.
```

<TryPromptButton
  prompt={`Build a Black Friday landing page for home fragrance.

Traffic source: Retargeting campaign (warm audience, 30-day window).
Goal: 6%+ CVR and increase AOV from $65 to $95+ with bundle offers.

Page structure:
- Hero: Bold discount headline "40% Off Sitewide" + countdown timer (ends Sunday 11:59 PM EST)
- Featured bundle section: "Complete Set, Save 50%" with single product bundle at $95 (normally $190)
- Bestsellers grid: 6 products, show original price + sale price
- Trust section: Free shipping, 30-day returns, 10K+ 5-star reviews
- FAQ: 3 questions about the sale (shipping cutoffs, return policy, discount stacking)
- Single CTA: "Shop Now"

Optimize for mobile, TikTok traffic. Keep page fast and focused.`}
/>

***

## Subscription & Bundle Funnels

**When to use:** Selling subscription products or bundles where [LTV](/glossary#ltv) optimization is more important than first-order [AOV](/glossary#aov).

**Why it works:** Subscription offers can increase [LTV](/glossary#ltv) by 3-5x. Even if first-order [CVR](/glossary#cvr) drops slightly, the unit economics improve dramatically.

```text theme={null}
Build a subscription landing page for [PRODUCT_NAME].

Traffic source: Paid social (Meta, targeting existing customers + lookalikes).
Goal: 35%+ subscription attach rate to improve LTV from $85 to $240+.

Page structure:
- Hero: "Never run out, Subscribe & Save 20%"
- Value prop section: Show cost comparison (one-time: $28/month, subscription: $22/month + free shipping)
- Benefits: Flexibility (pause anytime), savings breakdown (save $72/year), convenience
- How it works: 3 steps with icons (choose frequency, we ship automatically, cancel anytime)
- Testimonials: Focus on convenience and consistency ("I love not having to remember to reorder")
- FAQ: 4 questions (How do I pause? Can I change frequency? What if I want to cancel?)
- CTA toggle: "One-Time Purchase ($28)" vs "Subscribe & Save ($22/month)", default to subscription

Keep layout clean and trust-forward. This is a high-LTV offer.
```

<TryPromptButton
  prompt={`Build a subscription landing page for a monthly coffee subscription.

Traffic source: Paid social (Meta, targeting existing customers + lookalikes).
Goal: 35%+ subscription attach rate to improve LTV from $85 to $240+.

Page structure:
- Hero: "Never run out, Subscribe & Save 20%"
- Value prop section: Show cost comparison (one-time: $28/month, subscription: $22/month + free shipping)
- Benefits: Flexibility (pause anytime), savings breakdown (save $72/year), convenience
- How it works: 3 steps with icons (choose frequency, we ship automatically, cancel anytime)
- Testimonials: Focus on convenience and consistency ("I love not having to remember to reorder")
- FAQ: 4 questions (How do I pause? Can I change frequency? What if I want to cancel?)
- CTA toggle: "One-Time Purchase ($28)" vs "Subscribe & Save ($22/month)", default to subscription

Keep layout clean and trust-forward. This is a high-LTV offer.`}
/>

***

## Pre-Launch & Email Capture

**When to use:** Building a waitlist before launch to validate demand and create urgency. Goal is to maximize email capture rate.

**Why it works:** Pre-launch pages with strong offers (early access, launch discount) convert at 12-20% capture rates vs 2-5% for generic email forms.

```text theme={null}
Build a pre-launch waitlist page for [PRODUCT_NAME].

Traffic source: Cold traffic from TikTok and Meta ads.
Goal: 15%+ email capture rate; collect 5,000 emails before launch.

Page structure:
- Hero: Product image + headline emphasizing scarcity ("Launching Soon, Join the Waitlist")
- Offer callout: "First 500 people get 25% off at launch"
- 3-benefit section: Why this product solves their problem
- Social proof: "3,200 people already on the waitlist" (live counter if possible)
- Email capture form: Single field (email), button: "Reserve My Spot"
- Privacy note: "We respect your inbox, launch updates only"
- Launch countdown: "Launching in 12 days"
- FAQ: 3 questions (When does it launch? What's the discount? Can I share this?)

No pricing, no checkout. This is purely email capture. Keep it fast and mobile-optimized.
```

<TryPromptButton
  prompt={`Build a pre-launch waitlist page for a new skincare serum.

Traffic source: Cold traffic from TikTok and Meta ads.
Goal: 15%+ email capture rate; collect 5,000 emails before launch.

Page structure:
- Hero: Product image + headline emphasizing scarcity ("Launching Soon, Join the Waitlist")
- Offer callout: "First 500 people get 25% off at launch"
- 3-benefit section: Why this product solves their problem
- Social proof: "3,200 people already on the waitlist" (live counter if possible)
- Email capture form: Single field (email), button: "Reserve My Spot"
- Privacy note: "We respect your inbox, launch updates only"
- Launch countdown: "Launching in 12 days"
- FAQ: 3 questions (When does it launch? What's the discount? Can I share this?)

No pricing, no checkout. This is purely email capture. Keep it fast and mobile-optimized.`}
/>

***

## Message-Matched Landing Pages

**When to use:** Running multiple ad creatives and want each to send traffic to a dedicated, message-matched landing page.

**Why it works:** Message-match (ad headline → landing page headline) improves [CVR](/glossary#cvr) by 40-100%. Generic pages break the [CTR](/glossary#ctr) → [CVR](/glossary#cvr) flow and waste ad spend.

```text theme={null}
Build a message-matched landing page for my Meta ad creative: [AD_HEADLINE].

Ad headline: "Get glowing skin in 7 days, clinically proven formula"
Traffic source: Meta ads, cold audience (25-45, interested in skincare).
Goal: Match ad promise and improve CVR from 2.8% to 5.5%+ to bring CAC under $45.

Page structure:
- Hero: Use the exact ad headline "Get glowing skin in 7 days" + product image matching the ad creative
- Subhead: "Clinically proven formula, 10,000+ 5-star reviews"
- Results section: Before/after images, "92% saw visible results in 7 days" (match the ad claim)
- 3-benefit section: Why it works (ingredients, science, results)
- Testimonials: Focus on speed of results ("I saw results in 5 days!")
- FAQ: 4 questions (Is it safe for sensitive skin? How fast does it work? etc.)
- Single CTA: "Get Glowing Skin Today"

Match ad tone and visual style. This is cold traffic, focus on proof and results.
```

<TryPromptButton
  prompt={`Build a message-matched landing page for my Meta ad creative.

Ad headline: "Get glowing skin in 7 days, clinically proven formula"
Traffic source: Meta ads, cold audience (25-45, interested in skincare).
Goal: Match ad promise and improve CVR from 2.8% to 5.5%+ to bring CAC under $45.

Page structure:
- Hero: Use the exact ad headline "Get glowing skin in 7 days" + product image matching the ad creative
- Subhead: "Clinically proven formula, 10,000+ 5-star reviews"
- Results section: Before/after images, "92% saw visible results in 7 days" (match the ad claim)
- 3-benefit section: Why it works (ingredients, science, results)
- Testimonials: Focus on speed of results ("I saw results in 5 days!")
- FAQ: 4 questions (Is it safe for sensitive skin? How fast does it work? etc.)
- Single CTA: "Get Glowing Skin Today"

Match ad tone and visual style. This is cold traffic, focus on proof and results.`}
/>

***

## Mobile Optimization

**When to use:** Your page converts well on desktop but mobile [CVR](/glossary#cvr) is 40-60% lower. Most paid social traffic (70-80%) is mobile.

**Why it works:** Mobile-first pages reduce bounce rates and improve [CVR](/glossary#cvr). Every second of load time costs 7-10% of conversions.

```text theme={null}
Optimize this landing page for mobile performance.

Current issue: Desktop CVR is 5.2%, mobile CVR is 2.1%. 75% of traffic is mobile from TikTok ads.
Goal: Bring mobile CVR to 4.5%+ to match desktop performance.

Mobile-specific changes:
- Hero section: Stack headline, image, and CTA vertically. Ensure CTA button is thumb-friendly (min 48px height).
- Benefits section: Single column, not a 3-column grid. Keep benefit text short (one sentence max).
- Testimonials: Single column carousel, not a grid. Make it swipeable.
- Images: Compress and optimize for fast loading. Target under 2 seconds for hero image.
- Forms: Single field (email or phone), large input area, button takes full width.
- Remove desktop-only sections (long FAQ, comparison tables), keep mobile page focused.

Do not change desktop layout. This is mobile-only optimization.
```

***

## Quick Refinements

**When to use:** You already have a page built but need to optimize specific sections based on performance data.

**Why it works:** Small, targeted changes protect what's working while improving weak spots. Incremental optimization beats full rebuilds.

### Improve Social Proof Placement

```text theme={null}
Move testimonials section above the fold, directly under the hero.

Current issue: CVR is 3.8% but heatmaps show visitors aren't scrolling to testimonials.
Goal: Increase trust signals early to improve CVR to 5%+.

Changes:
- Place 3 testimonials in a horizontal row under the hero section
- Keep testimonials short (2-3 sentences max)
- Show star ratings and customer names
- Do not change hero, benefits, or CTA sections

This is a single-section optimization.
```

### Tighten CTA Copy

```text theme={null}
Update all CTAs to be more direct and outcome-focused.

Current CTA: "Learn More"
New CTA: "Get 25% Off Today"

Update every button on the page to use the new CTA copy. Do not change button styling, placement, or page structure, only the button text.
```

### Add Urgency Element

```text theme={null}
Add a countdown timer under the hero headline.

Offer: "Sale ends Sunday at 11:59 PM EST"
Goal: Increase urgency to improve CVR from 4.2% to 5.5%+.

Timer placement: Directly under headline, centered, bold red text.
Do not change any other sections, this is a single urgency element addition.
```