你会得到

  • 一个独立的定价区块,可离线运行,也能嵌入 iframe
  • 两到四张套餐卡片,带标签、功能列表、推荐套餐飘带和每个套餐的按钮
  • 「月付 / 年付」切换,附节省提示和按年计费的说明
  • 浅色和深色主题,以及针对成品文件的静态检查器
  • 可选的抠图贴纸插画,报价后由 PopNow 制作

适合

  • 独立应用、创作者工具和小型 SaaS 产品
  • 会员、课程或电子报的套餐
  • 希望语气轻松、友好的发布页面

不适合

  • 带长篇对比表的企业价目表
  • 语气正式或极度简约的品牌

怎么用

在 Claude 或 ChatGPT 里

用 PopNow 的技能「手绘风定价区块」(pricing-page-section)帮我做这件事:为 Brewlog(一款咖啡品鉴日志)做定价:免费版,Barista 每月 4 美元或每年 40 美元,面向咖啡馆的 Roastery 每月 12 美元或每年 120 美元。推荐 Barista。

在编程 Agent 里

/popnow-pricing-page-section 为 Brewlog(一款咖啡品鉴日志)做定价:免费版,Barista 每月 4 美元或每年 40 美元,面向咖啡馆的 Roastery 每月 12 美元或每年 120 美元。推荐 Barista。

接着试试

报价做一张用我们强调色的手冲壶贴纸,并抠出来。

改成 Svelte 组件,让网站自己的主题切换控制深色模式。

需要准备

  • 套餐名称、月付和年付价格、限额和功能
  • 你推荐哪个套餐,以及每个按钮去往何处
  • 一句关于试用、退款或取消的实话
  • 可选:用于贴纸插画的 PopNow API 密钥

类似技能

查看全部 →

评分

还没有评分。安装过了?来打第一个分吧。

为这个技能评分

常见问题

不用框架,年付切换能运行吗?

可以。每个价格都把月付和年付的数值作为数据属性保存,几行原生 JavaScript 就能切换;如果你只卖一种计费周期,删掉切换即可。

手写字体在每台设备上都能正常显示吗?

它使用系统中已安装的手写字体,并带有回退字体,因此无需下载,区块也能离线工作。在 macOS、Windows 和 Android 上,具体字形会略有不同。

PopNow 在这里做什么?

为页边提供一幅可选的贴纸插画:墨线与平涂色彩的风格,之后用 PopNow 的背景移除工具干净地抠出。每次运行前都会先报价,并且只有你同意后才开始。

能放进现有网站里吗?

可以。所有样式都限定在 .skp- 类名之下,技能会把区块重新构建为 React、Vue、Svelte 或 Astro 的组件,主题由宿主页面掌控。

能作为 SaaS 定价模板使用吗?

可以。套餐、月付和年付价格、功能行和「最受欢迎」标签都来自同一份数据块,与大多数 SaaS 定价页面的做法一致。可以把它当作完整的定价页模板使用,也可以把定价表模板放进现有页面。