Prompt pack · 25 prompts

Marketing & Conversion Pack

Build better marketing pages, funnels, and conversion sections faster with AI.

$27One-time purchase · checkout on Gumroad

Instant download after checkout. All sales are final — every prompt is listed below.

Marketing & Conversion Pack cover
25 copy-paste promptsOne HTML file per promptWorks with Claude, ChatGPT, Gemini, and CursorPrompt customizer includedInstant download

What's inside

All 25 prompts in the pack

Every one of these is in the download as a full, copy-paste prompt.

  1. 01

    High-Converting Call-to-Action Banner with Urgency Timer

    A high-converting CTA banner with animated countdown digits that pulse to draw attention, layered over a dynamic gradient background that shifts colors as the timer runs down to amplify urgency.

    Best forFlash sales, product launches, time-sensitive promotions

    • Pulsing countdown digits
    • Dynamic gradient background
    • Bold CTA
  2. 02

    Exit-Intent Popup Modal with Lead Magnet Offer

    An exit-intent popup modal that detects when the user's cursor leaves the viewport, triggers a smooth fade-in overlay with a lead magnet offer, and validates the email input inline before submission.

    Best forLead capture, list building, exit-intent conversion recovery

    • Smooth fade-in modal
    • Inline email validation
    • Mouseleave trigger
  3. 03

    Sticky Announcement Bar with Dismiss Button

    A sticky top-of-page announcement bar with a subtle glassmorphism backdrop-blur effect, a dismiss button with focus-visible outlines, and an aria-live region that announces dismissal to screen readers.

    Best forSite-wide announcements, promo banners, feature launches

    • Glassmorphism blur
    • Accessible dismiss
    • ARIA live region
  4. 04

    Interactive Pricing Calculator with ROI Projections

    An input-driven pricing calculator with debounced event listeners for real-time ROI projection updates, paired with animated SVG bar charts that scale their fill levels as users adjust inputs.

    Best forSaaS pricing pages, cost-comparison tools, value demonstration

    • Debounced inputs
    • Animated SVG bar charts
    • Real-time projections
  5. 05

    Animated Infinite-Scroll Testimonial Carousel

    An infinite-loop testimonial carousel that clones cards via JavaScript for seamless looping, combined with CSS scroll-snap for precise alignment and smooth horizontal sliding animations.

    Best forSocial proof sections, customer reviews, trust-building blocks

    • Infinite loop cloning
    • Scroll snap alignment
    • Smooth slide transitions
  6. 06

    Feature Comparison Matrix with Tooltip Explanations

    A feature comparison matrix with hover and focus-triggered tooltips powered by Tailwind's group and peer utilities, plus keyboard-accessible ARIA attributes and smooth reveal transitions on each cell.

    Best forProduct comparisons, pricing tier breakdowns, competitive analysis

    • Group/peer tooltips
    • Keyboard accessible
    • ARIA transitions
  7. 07

    Interactive Product Tour with Step-by-Step Guidance

    A step-by-step product tour with a fixed modal overlay and animated progress bar that updates its width to indicate completion, plus JavaScript focus traps and scroll-snap navigation between guide steps.

    Best forUser onboarding, feature walkthroughs, guided product demos

    • Fixed modal overlay
    • Animated progress bar
    • Focus-trapped steps
  8. 08

    Social Proof Notification Toast with Recent Purchases

    A social proof notification toast that slides in and out with custom keyframe animations, dynamically swapping purchase data via WebSocket or polling with smooth Tailwind transition effects on content changes.

    Best forE-commerce stores, SaaS signups, FOMO-driven conversions

    • Slide-in/out keyframes
    • Dynamic content swap
    • Polling updates
  9. 09

    Video Sales Letter Layout with Sticky CTA

    A video sales letter layout with a sticky CTA button anchored to the bottom of the viewport with a subtle shadow, plus semi-transparent gradient layers over the video's lower portion to maintain button contrast.

    Best forVSL funnels, course sales pages, high-ticket product pitches

    • Sticky bottom CTA
    • Gradient overlay on video
    • Always-visible action
  10. 10

    Interactive Quiz Funnel with Personalized Results

    An interactive quiz funnel that renders questions dynamically using grid and flex utilities, then animates personalized result cards with scale and opacity transitions when the quiz completes.

    Best forLead qualification, product recommendation engines, interactive funnels

    • Dynamic grid questions
    • Scale/opacity result cards
    • Personalized outcomes
  11. 11

    Lead Generation Landing Page with Split-Screen Design

    A split-screen lead generation landing page using a two-column grid with custom minmax widths, separated by a diagonal or curved SVG clip-path division for a modern aesthetic between content and image sections.

    Best forLead-gen campaigns, signup landing pages, content-gated offers

    • Two-column grid
    • Diagonal clip-path divider
    • Balanced visual weight
  12. 12

    Webinar Registration Page with Countdown and Speakers

    A webinar registration page with a live countdown timer using font-mono digits and setInterval, plus a horizontally scrollable speaker profile carousel with smooth snap scrolling and hover scale-up animations.

    Best forWebinar signups, virtual event promotion, speaker-led landing pages

    • Live countdown timer
    • Horizontal speaker scroll
    • Hover scale-up cards
  13. 13

    E-book Download Landing Page with Chapter Previews

    An e-book download landing page with expandable accordion chapter previews using smooth max-height transitions, plus a sticky table of contents sidebar that auto-highlights the active chapter via Intersection Observer.

    Best forContent marketing, lead magnets, gated resource downloads

    • Expandable accordion chapters
    • Sticky TOC sidebar
    • Intersection Observer highlights
  14. 14

    App Download Landing Page with Device Mockups

    An app download landing page with layered device mockups using relative positioning and drop shadows for realistic overlapping effects, plus animated ping or bounce effects on key UI elements to simulate interactivity.

    Best forMobile app launches, app store promotion, product showcases

    • Layered device mockups
    • Overlapping drop shadows
    • Animated UI elements
  15. 15

    SaaS Feature Showcase with Interactive Animations

    A SaaS feature showcase with 3D card flip animations triggered by group-hover to reveal additional details on the back, plus SVG path stroke-dashoffset animations inside feature icons controlled by JavaScript scroll events.

    Best forSaaS marketing pages, feature overviews, product deep-dives

    • 3D card flip on hover
    • SVG stroke animations
    • Scroll-triggered reveals
  16. 16

    Affiliate Program Landing Page with Commission Calculator

    An affiliate program landing page with an embedded commission calculator featuring live input validation and output fields, plus interactive tiered sliders that update total earnings in real-time with smooth numeric transitions.

    Best forPartner programs, affiliate recruitment, revenue-share landing pages

    • Live commission calculator
    • Tiered sliders
    • Smooth numeric transitions
  17. 17

    Referral Program Dashboard with Unique Link Generation

    A referral program dashboard with a unique link generator that copies to clipboard and shows a confirmation tooltip, plus referral statistics displayed as animated progressive bars with numeric badges updated via data polling.

    Best forGrowth loops, referral programs, viral marketing dashboards

    • Copy-to-clipboard link
    • Animated progress bars
    • Real-time stat badges
  18. 18

    Interactive Case Study Layout with Data Visualizations

    An interactive case study layout with scroll-triggered data visualizations using Canvas API or SVG manipulation, plus toggle switches that dynamically filter case study data and update visualizations live without page reloads.

    Best forB2B case studies, results showcases, data-driven marketing

    • Canvas/SVG charts
    • Scroll-animated data
    • Toggle-filtered views
  19. 19

    Customer Success Story Grid with Video Interviews

    A responsive grid of customer success video interviews maintaining consistent 16:9 aspect ratios, with each thumbnail overlaid by a play button icon that animates with scale and opacity on hover to indicate interactivity.

    Best forTestimonial pages, customer story archives, video proof galleries

    • 16:9 aspect ratio grid
    • Hover play button overlay
    • Scale/opacity animation
  20. 20

    Interactive ROI Calculator with PDF Export Option

    An interactive ROI calculator with input-driven calculations and a PDF export button using jsPDF, presenting results in styled cards with animated number counters powered by requestAnimationFrame for smooth incremental changes.

    Best forSales enablement, value propositions, enterprise lead qualification

    • Input-driven calculations
    • Animated number counters
    • jsPDF export
  21. 21

    Limited-Time Offer Banner with Dynamic Stock Counter

    A limited-time offer banner with a dynamic stock counter displayed as a pulsing red badge that decreases visually, plus a red flash animation triggered via JavaScript when stock drops below a low-threshold warning level.

    Best forScarcity-driven sales, flash deals, inventory-based urgency

    • Pulsing stock badge
    • Red flash on low stock
    • Real-time counter
  22. 22

    Interactive Product Demo with Sandbox Environment

    An interactive product demo with a sandbox environment featuring tab controls to switch between product features with smooth opacity transitions, plus draggable UI components using cursor-grab and JavaScript drag events.

    Best forProduct-led growth, try-before-you-buy demos, interactive showcases

    • Tab-switched features
    • Draggable UI components
    • Smooth opacity transitions
  23. 23

    Newsletter Sponsorship Landing Page with Audience Stats

    A newsletter sponsorship landing page with a 3-column audience stats grid featuring animated number counters triggered by Intersection Observer, plus a horizontal logo carousel with hover opacity and scale animations.

    Best forMedia kits, newsletter monetization, sponsor pitch pages

    • Animated stat counters
    • Logo carousel
    • 3-column grid layout
  24. 24

    Event Ticketing Page with Seat Selection Map

    An event ticketing page with a grid-based seat selection map using clickable SVG seat icons that toggle selection states visually, plus full keyboard navigation with ring focus styles and ARIA roles for accessibility.

    Best forEvent promotion, venue ticket sales, conference registrations

    • Clickable SVG seat map
    • Keyboard nav
    • ARIA accessible selection
  25. 25

    Crowdfunding Campaign Page with Progress Bar and Rewards

    A crowdfunding campaign page with an animated progress bar that fills on data update with milestone marker tooltips, plus interactive reward tier cards that reveal detailed descriptions on hover or focus with shadow and transition effects.

    Best forProduct crowdfunding, pre-launch campaigns, community-funded projects

    • Animated progress bar
    • Milestone tooltips
    • Hover-reveal reward tiers

Preview

How prompt 01 opens

High-Converting Call-to-Action Banner with Urgency Timer

Prompt 01 / 25Preview
Act as a Senior Frontend Architect and UI/UX Expert.

The Task: Write the complete, production-ready code for a [High-Converting Call-to-Action Banner with Urgency Timer].

Tech Stack & Environment:
- Strictly a SINGLE HTML file containing everything.
- Use plain HTML5.
- Use the Tailwind CSS CDN (<script src="https://cdn.tailwindcss.com"></script>) in the head for all styling.
- Use plain Vanilla JavaScript enclosed in <script> tags for any interactivity.
- Use inline SVG paths for any icons (do not use external icon libraries).

Strict Requirements:
- Visual Excellence: It must look like a premium, modern SaaS product (subtle shadows, rounded corners, clean borders, smooth hover/focus effects).
- Responsive: Must look perfect on mobile, tablet, and desktop using Tailwind utility classes.

The feature-by-feature build steps continue in the pack — along with the other 24 prompts.

How to use it

Four steps, from the pack's own guide

Four steps. Zero setup. Every prompt in this pack is engineered to output a complete, single HTML file you can open directly in any browser.

Step 01

Copy the Prompt

Open any prompt page in this pack and copy the full prompt block to your clipboard.

Step 02

Paste into AI

Paste into Claude, ChatGPT, Gemini, Cursor, or any AI coding tool. No modifications required.

Step 03

Copy the Output Code

The AI returns a single complete HTML file. Copy the entire code block it produces.

Step 04

Save & Open

Save it as index.html and double-click to open in your browser. Done.

Tips from the pack

What you get

  • HTML version of the pack
  • PDF version of the pack
  • Instructions PDF

Digital download from Gumroad, available right after checkout. Nothing ships.

Best for

Marketers, affiliate marketers, freelancers, SaaS builders, landing page creators, and anyone who wants better website sections without starting from scratch every time.

$27One-time purchase
Get the pack →

All sales are final, per the Gumroad listing.

Questions

Before you buy

Which AI tools does it work with?

The pack’s own instructions name Claude, ChatGPT, Gemini, and Cursor. Paste a prompt into any of them, or a similar AI coding tool.

What does each prompt produce?

Each prompt asks the AI for one complete HTML file you can save and open in a browser. What comes back depends on the model you use — the pack recommends a strong one.

Do I need to install anything?

No build tools. Copy a prompt, paste it into your AI tool, save the HTML it returns, and open it in your browser.

What is the prompt customizer?

The HTML version of the pack includes a customizer: enter your brand, colors, or feature goals and it generates a tailored version of any prompt.

Can I get a refund?

No. All sales are final, as stated on the Gumroad listing. Every prompt in the pack is listed on this page so you can check it covers what you need first.

How is this different from the Mission Vault?

A prompt pack gives you single copy-paste prompts for individual UI features. The Mission Vault is a structured set of missions, safety rules, and build checklists for building complete dashboards with Claude Code.

More packs

The other nine packs

Marketing & Conversion Pack
$27 · 25 prompts
Get it →