包含首屏动画产品预览、Logo 跑马灯、功能网格、工作流程与数据统计、用户评价、定价表、FAQ 和收尾行动号召等落地页区块
lumen-lite — Next.js SaaS模板
作者 vigransamerpitak
Lumen Lite 是面向 AI SaaS 产品的免费开源落地页模板,基于 Next.js、React、Tailwind CSS 和 TypeScript 构建,提供明暗主题与完整的营销区块。
看看你的网站会是什么样
浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。
全部页面与视图 2
截图用于了解视觉与布局,交互效果请以实际项目为准。
值得关注的模板亮点
从已有项目资料中,快速了解它的特点。
提供明暗两套主题,并处理了页面加载时的主题闪烁
所有页面静态预渲染,除 Next.js 外仅依赖 Lucide 图标和 tailwind-merge
文案、定价方案和 FAQ 集中在 src/lib/site.ts,颜色通过 CSS 变量统一管理,便于替换品牌信息
采用 MIT 许可,允许免费使用、修改、商用和分发
模板详细介绍
Lumen Lite 是一个面向 AI SaaS 产品的免费开源落地页模板,仓库采用 MIT 许可,代码可免费使用、修改、商用和分发。页面包含首屏动画产品预览、Logo 跑马灯、功能网格、工作流程与数据统计、用户评价、带月付/年付切换的定价表、FAQ 和收尾行动号召,以及响应式导航栏和页脚。模板提供明暗两套主题,并处理了加载时的主题闪烁问题。所有页面均为静态预渲染,除 Next.js 外仅依赖 Lucide 图标和 tailwind-merge。内容集中在 src/lib/site.ts,颜色以 CSS 变量形式定义在 src/app/globals.css 顶部,字体通过 next/font 在 src/app/layout.tsx 中加载,区块顺序可在 src/app/(marketing)/page.tsx 中调整。该模板只覆盖落地页本身,不包含登录后的仪表盘、AI 聊天、客户列表、账单和设置等应用界面;这些属于同作者的付费完整套件 Lumen。使用前需注意,演示图片、字体、图标等第三方素材的许可需单独核对,域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
适合你的项目吗?
适用场景
- 为 AI SaaS 产品搭建营销落地页
- 作为企业官网或产品介绍页的起始模板
- 在 Next.js 项目中快速验证落地页的视觉与内容结构
- 需要明暗主题切换的营销页面开发
适合人群
- 需要免费开源落地页模板的 AI SaaS 产品团队
- 使用 Next.js、React、Tailwind CSS 和 TypeScript 的前端开发者
- 希望以较低成本搭建产品官网并自行替换品牌内容的个人或小团队
上手与定制指南
结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。
- 1
需要 Node.js 20.9 或更新版本
- 2
克隆仓库后执行 npm install 安装依赖,再运行 npm run dev 启动开发服务器,默认访问 http://localhost:3000
- 3
文案、定价方案和 FAQ 位于 src/lib/site.ts,颜色变量位于 src/app/globals.css 顶部,字体在 src/app/layout.tsx 中配置
- 4
区块顺序可在 src/app/(marketing)/page.tsx 中调整或删除
- 5
演示图片、字体、图标等第三方素材需按各自许可单独核对,外部服务可能另外收费
授权与来源资料
使用条件与限制
免费使用 · 保留许可声明本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。
使用时需要遵守
- 允许免费使用、修改、商用和分发该版本代码。
- 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
- 代码按现状提供;担保与责任限制以原许可证及适用法律为准。
额外费用与待核对事项
- 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
- 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
- 付费完整套件 Lumen 仅为前端套件:AI 聊天使用示例回复,登录/注册界面仅为界面展示,需自行接入模型与认证服务商。
- 完整版 Lumen 套件按单独的商业许可出售,不属于本免费 MIT 模板的授权范围。
查看原文依据
Permission is hereby granted, free of charge
许可证原文
The full kit is a front-end kit: the chat runs on sample replies and the auth screens are interface only, so you connect your own model and auth provider.
README 原文
https://github.com/vigransamerpitak/lumen-lite/blob/main/LICENSE.mdhttps://github.com/vigransamerpitak/lumen-lite/blob/main/README.mdThe full Lumen kit is sold under a separate commercial license.
README 原文
DeepSeek 根据仓库许可证和 README 整理 ·2026-10-08。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。
项目核对记录与介绍依据
模板资料
- 来源平台
- GitHub
- 资料与维护参考分
- 资料较完整 · 85 / 100
- 技术栈
- Next.js · React
- 网站类型
- SaaS · 企业官网 · 启动器
这个分数如何计算
本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。
这个项目需要核对什么
- 记录的仓库更新时间
- 2026-10-08
- 截图检查日期
- 2026-10-08
已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。
目录记录的主要技术栈是 Next.js。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。
查看具体选型方法 →介绍的制作与核对状态
介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。
审核声明: [email protected] · 2026-10-09
查看当时使用的来源资料
SHA-256: f14f8333190d14716b283bf9c524a6b6d4892c710cad5cb34e346506fc1a0c84
2026-10-08T18:21:25.741Z
来源文件 / 仓库# Lumen Lite A free, open-source landing page for AI SaaS products. Built with Next.js 16, React 19, Tailwind CSS 4 and TypeScript.  **[Live demo](https://lumen-eight-bice.vercel.app)** · **[Get the full kit](https://vigranpitak.gumroad.com/l/lumen-ai-saas-kit)** ## What's included - Hero with an animated product preview - Logo marquee - Feature grid - How-it-works steps and stats - Testimonials - Pricing table with a monthly / yearly toggle - FAQ and a closing call to action - Responsive navbar and footer - Light and dark themes with no flash on load Everything is statically prerendered, and the only dependencies beyond Next.js are Lucide icons and tailwind-merge. ## Getting started Requires Node.js 20.9 or newer. ```bash git clone https://github.com/vigransamerpitak/lumen-lite.git cd lumen-lite npm install npm run dev ``` Open http://localhost:3000. ## Make it yours - **Copy:** all text, pricing plans and FAQs live in `src/lib/site.ts`. - **Colors:** every color is a CSS variable at the top of `src/app/globals.css`. Change `--accent`, `--accent-fg` and `--accent-text` to rebrand. - **Fonts:** loaded in `src/app/layout.tsx` with `next/font`. - **Sections:** reorder or remove them in `src/app/(marketing)/page.tsx`. ## Need the app behind the landing page? Lumen Lite is the landing page from **[Lumen, the full AI SaaS starter kit](https://vigranpitak.gumroad.com/l/lumen-ai-saas-kit)**. The full kit adds everything that comes after the "Sign in" button, in the same design system, so the changes you make here carry straight over. | | Lumen Lite (free) | Lumen (full kit) | | --- | :---: | :---: | | Landing page | ✓ | ✓ | | Light and dark themes | ✓ | ✓ | | Dashboard with KPI cards and interactive charts | | ✓ | | AI chat with streaming UI, stop button and model picker | | ✓ | | Customers table with search, filters and pagination | | ✓ | | Billing page with plan, usage and invoices | | ✓ | | Settings with profile, notifications and API keys | | ✓ | | Sign in, sign up and reset password screens | | ✓ | | Step-by-step user guide (English and Thai) | | ✓ | ### Dashboard  ### AI chat  ### Billing  ### Customers  Try every page in the **[live demo](https://lumen-eight-bice.vercel.app/dashboard)**, then **[get the full kit on Gumroad](https://vigranpitak.gumroad.com/l/lumen-ai-saas-kit)**. The full kit is a front-end kit: the chat runs on sample replies and the auth screens are interface only, so you connect your own model and auth provider. The included guide shows where. ## License MIT. Use it for anything, including commercial projects. See `LICENSE.md`. The full Lumen kit is sold under a separate commercial license.
看看同类模板
对比同技术栈与用途的模板,找到更适合的视觉与内容结构。

ai-website-cloner-template
Clone any website with one command using AI coding agents
Next.js · 启动器

Next.js SaaS Starter
Next.js SaaS Starter 是 Next.js 官方维护的 SaaS 起点模板,定位介于学习资源和可直接部署的脚手架之间。
Next.js · SaaS

Next.js Commerce
Next.js Commerce 是 Vercel 团队维护的电商启动模板,基于 Next.js App Router 构建,采用服务端渲染、React Server Components、Server Actions …
Next.js · 电商

Next-js-Boilerplate
Next-js-Boilerplate 是一个面向 Next.js 16、Tailwind CSS 4 和 TypeScript 的启动器,核心定位是开发者体验优先。
Next.js · 启动器

tailwind-nextjs-starter-blog
tailwind-nextjs-starter-blog 是一个面向个人技术博客的 Next.js 与 Tailwind CSS 启动模板,其 v2 版本基于 App Router 与 React Server Comp…
Next.js · 博客

next-forge
Production-grade Turborepo template for Next.js apps.
Next.js · 启动器
