SaaS Landing
完整的 SaaS 落地页:导航栏、Hero、客户 Logo、功能 Bento、用户评价、定价、FAQ、CTA 和页脚。
#landing-page#marketing#pricing-section
安装
$ npx shadcn@latest add https://chromotion.dev/r/saas-landing.json页面会放到 app/saas-landing/page.tsx,用到的组件会一并安装到 components 目录。
用到的组件
安装模板时会一并安装这些组件。
- Navbar导航响应式顶部导航栏:滚动后毛玻璃、移动端折叠菜单、悬浮胶囊样式。
- Hero Spotlight营销区块带聚光灯渐变、网格背景和双按钮的落地页 Hero 区块。
- Logo Cloud营销区块客户 Logo 墙,可选无限滚动走马灯或静态网格。
- Feature Bento营销区块不对称的 Bento 网格,用来展示产品的核心功能。
- Testimonial Marquee营销区块双行反向滚动的用户评价走马灯,悬停时暂停,两侧渐隐。
- Pricing Cards营销区块三档定价卡片,支持月付 / 年付切换,并突出推荐方案。
- FAQ Accordion营销区块常见问题手风琴,平滑展开,支持单开或多开。
- CTA Banner营销区块带光晕和点阵背景的行动号召横幅,支持居中或左对齐。
- Site Footer营销区块多列链接的网站页脚,含社交图标、版权信息和超大渐隐字标。