pricing-page
A standalone pricing page — header, plan tiers, feature comparison table, and an FAQ. Use when the brief asks for "pricing", "plans", "subscription tiers", or a "compare plans" page.
Profile →npx skills add nexu-io/open-design --skill pricing-page --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# Pricing Page Skill Produce a single-screen pricing page that respects the active DESIGN.md. ## Workflow 1. **Read the active DESIGN.md** (injected above). Use only its colors, type tokens, and component patterns. 2. **Classify** the product from the brief and pick a tier shape: - 3-tier (most common): Free / Pro / Team or Starter / Growth / Enterprise. - 4-tier when the brief says "scale" or "enterprise plus". - 2-tier when it says "individual / business" or "personal / pro". 3. **Sections**, in order: 1. **Hero** — page title (e.g. "Pricing"), one-line subhead, optional monthly/annual toggle. 2. **Plan cards** — one card per tier. Each card: tier name, price (use the display font + larger scale for the number), 1-line positioning, 4–6 bullet features, primary CTA. Mark the recommended tier with the DS accent border or a small badge. 3. **Comparison table** — feature rows × tier columns, ✓ / — / value cells. Group features into 2–3 logical sections (Core, Collaboration, Support, Security…). Sticky header. 4. **FAQ** — 4–6 collapsible Q&A items. Use `<details><summary>` for the collapse — no JS. 5. **Footer CTA** — single line + button, accent band sparingly. 4. **Write** one self
- Workflow
- Output contract
What does the pricing-page skill do?
A standalone pricing page — header, plan tiers, feature comparison table, and an FAQ. Use when the brief asks for "pricing", "plans", "subscription tiers", or a "compare plans" page.
How do I install it?
Run `npx skills add nexu-io/open-design --skill pricing-page --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From nexu-io/open-design, a repository with 83,577 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.