Pricing Page (High‑Conversion) — Web Design Skill

SkillMedia

Design high-conversion SaaS pricing pages with plan structures, comparison patterns, conversion strategies, copy templates, SEO/AEO checklists, and layout types (3-card, slider, persona split, enterprise).

Instructions available. Your AI can read the instructions. Execution depends on the setup they require.

Add ahel to your AI once: Claude, ChatGPT, Cursor, Claude Code or Codex. Then ask it to use this.

Then ask your AI: use the Pricing Page (High‑Conversion) skill

What this skill tells your AI

The instructions your AI receives, as published by bidewio/better-openclaw in skills/pricing-page-design/SKILL.md and read by ahel’s review.

Before you design/write

  1. Offer + audience: What problem does the product solve? Who is the buyer?
  2. Plans: How many tiers? What differentiates them? Usage-based or flat?
  3. Objections + risk: What stops someone from signing up? (price, trust, complexity)
  4. Proof: Logos, testimonials, case studies, metrics available?
  5. Traffic context: Organic? Paid? Referral? Affects messaging urgency.

Core structure

Above the fold (must)

  • Headline: value proposition, not "Pricing"
  • Subheadline: who it's for + key benefit
  • Plan cards: name, price, CTA, 3–5 key features
  • Highlighted plan: visual emphasis on recommended tier
  • Toggle: monthly / annual (show savings)

Below the fold (high leverage)

  • Feature comparison table: collapsed by default on mobile
  • FAQ section: address top 3-5 objections
  • Social proof: logos, testimonials, metrics
  • Enterprise CTA: "Contact sales" for custom needs

Layout types (pick one)

  • A) Classic 3‑card: Most common, works for most SaaS
  • B) Value metric slider: Usage-based pricing (API calls, seats)
  • C) Pick your path (two columns): Two distinct buyer personas
  • D) Enterprise last mile: Self-serve + enterprise side-by-side

High‑conversion strategies

  1. Make the decision easy: Highlight one plan, reduce choice paralysis
  2. Anchor value: Show what they get, not just cost
  3. Reduce risk: Free trial, money-back guarantee, no CC required
  4. Handle objections before bounce: FAQ, comparison, social proof
  5. Readable comparison: Avoid 20-row feature tables; group by category

Copywriting templates

  • Headlines: "Simple pricing for [audience]", "Start free, scale as you grow"
  • Plan descriptions: 2 lines max, benefit-focused
  • CTA buttons: "Start free trial", "Get started", "Talk to sales"
  • Feature bullets: Write like outcomes, not features

Tips for AI Agents

  • Always ask about number of tiers and differentiators before designing.
  • Confirm toggle (monthly/annual) and whether enterprise tier exists.
  • Default to the classic 3-card layout unless told otherwise.
  • Include FAQ schema hints for SEO when generating HTML.

Signals

GitHub stars
58
Forks
6
Last commit
Aug 2026
Advanced
Item type
skill
Key
pricing-page-design
Source
github.com/bidewio/better-openclaw