单页 HTML 落地页,使用 Tailwind 工具类,无模板引擎、框架或构建步骤
template-bright-academy — HTML 企业官网模板
作者 freewebstore-online
FreeWebStore 的 bright-academy 模板,面向课后学院、辅导中心、音乐与语言学校等教育项目,提供单页 HTML 落地页,使用 Tailwind 工具类且不依赖 JavaScript。
看看你的网站会是什么样
浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。
全部页面与视图 2
截图用于了解视觉与布局,交互效果请以实际项目为准。
值得关注的模板亮点
从已有项目资料中,快速了解它的特点。
不依赖 JavaScript,移动端导航与 FAQ 折叠使用原生 <details> 元素
浅色配色:奶油色页面、靛蓝结构色带、琥珀强调色,使用系统字体栈
包含 hero、programs、how、who、pricing、stories、faq、contact 等区块,部署时可拆分为独立编辑区块
提供 business、contact、about、fws.byline 等通用插槽,定制点以 data-fws-slot 标记
MIT 许可,允许免费使用、修改、商用和分发该版本代码
模板详细介绍
bright-academy 是 FreeWebStore 模板库中面向 education.academy 分类的 HTML 模板,由 @serge-ivo 制作。它是一套单页落地页,用于展示教育项目,适合课后学院、辅导中心、音乐与语言学校、棋类与体育俱乐部以及学校自办的拓展课程。README 说明该模板填补了 FWS 模板库此前只有本地服务与作品集类目的教育空白。
设计上采用浅色优先:奶油色 #fdfbf7 页面底色、靛蓝 950 结构色带、琥珀 300 强调色,理由是家长和学校工作人员多在白天用手机阅读。字体使用系统字体栈,标题为 font-black,正文行高 leading-8,不加载网络字体。模板不含 JavaScript,移动端导航和 FAQ 折叠使用原生 <details> 元素,在禁用 JS 或严格 CSP 下仍可工作。无障碍方面包含跳转链接、带标签的表单控件、装饰性字符的 aria-hidden、首图 alt 文本和可见焦点样式。
页面由 hero、programs、how(三步)、who(学生/家长/学校)、pricing(三档)、stories(推荐语)、faq、contact(联系方式与试听申请表单)和页脚组成。每个区块都是顶层 <section id="...">,平台在部署时会将其拆分为可独立编辑的区块。模板提供通用插槽:business.name、business.tagline、about.body、contact.phone、contact.email、contact.address、contact.hours、fws.byline,具体见 slots.md。
使用限制:仅支持 HTML 与 Tailwind 工具类,没有模板引擎、框架或构建步骤;输出为单页,FWS 每个商家生成一个 HTML 文件,多页属于 PWS 功能。定制点由 data-fws-slot="..." 标记。视觉改动后需重新生成 preview.png(1280×720,≤500KB)。发布流程使用 @freewebstore/cli 的 doctor、login、publish 命令。代码采用 MIT 许可,可免费使用、修改、商用和分发,但演示图片、字体、图标等第三方素材需单独核对许可,域名、托管等外部服务可能另行收费。
适合你的项目吗?
适用场景
- 课后学院或辅导中心搭建展示课程与试听申请的落地页
- 音乐、语言学校或棋类、体育俱乐部介绍项目并收集咨询
- 学校自办拓展课程发布项目信息、定价与联系方式
- 需要无 JavaScript、在严格 CSP 或禁用 JS 环境下仍可用的教育类单页
适合人群
- 教育项目运营者,如课后学院、辅导中心、音乐与语言学校
- 棋类、体育俱乐部等面向家长和学生的兴趣培训机构
- 学校内部负责拓展课程或 enrichment 项目的团队
- 希望以单页 HTML 快速搭建教育类落地页并自行修改内容的开发者
上手与定制指南
结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。
- 1
在编辑器中打开 index.html 直接修改,仅使用 HTML 与 Tailwind 工具类,不要引入模板引擎或构建步骤
- 2
通过 data-fws-slot="..." 标记定位可定制插槽,如 business.name、contact.phone、contact.email 等
- 3
输出为单页,FWS 每个商家生成一个 HTML 文件;多页属于 PWS 功能
- 4
视觉改动后重新生成 preview.png,尺寸 1280×720,文件不超过 500KB
- 5
发布使用 npx @freewebstore/cli doctor 本地校验、login 安装 GitHub App、publish 上传并排队审核
授权与来源资料
使用条件与限制
免费使用 · 保留许可声明本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。
使用时需要遵守
- 允许免费使用、修改、商用和分发该版本代码。
- 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
- 代码按现状提供;担保与责任限制以原许可证及适用法律为准。
额外费用与待核对事项
- 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
- 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
- 模板仅允许使用 HTML 与 Tailwind 工具类,不得引入模板引擎、前端框架或构建步骤,否则不符合该模板的定制约束。
- 该模板输出为单页,FWS 每个商家仅生成一个 HTML 文件;多页输出属于 PWS 功能,不在本模板范围内。
- 发布流程需要执行 @freewebstore/cli login,安装 GitHub App 并登录账号后才能上传模板。
- 发布需使用 @freewebstore/cli publish 上传、创建仓库并排队等待审核,并非即时上线。
查看原文依据
Permission is hereby granted, free of charge
许可证原文
**HTML + Tailwind utility classes only.** No templating engines, no framework, no build step.
README 原文
**Single-page output.** FWS produces one HTML file per business. Multi-page is a PWS feature, not FWS.
README 原文
npx @freewebstore/cli login # one-time GitHub App install
README 原文
https://github.com/freewebstore-online/template-bright-academy/blob/main/LICENSEhttps://github.com/freewebstore-online/template-bright-academy/blob/main/README.mdnpx @freewebstore/cli publish # upload + create repo + queue for review
README 原文
DeepSeek 根据仓库许可证和 README 整理 ·2026-10-05。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。
项目核对记录与介绍依据
模板资料
- 来源平台
- GitHub
- 资料与维护参考分
- 资料较完整 · 80 / 100
- 技术栈
- HTML
- 网站类型
- 企业官网
这个分数如何计算
本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。
这个项目需要核对什么
- 记录的仓库更新时间
- 2026-08-11
- 截图检查日期
- 2026-10-05
已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。
目录记录的主要技术栈是 HTML。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。
查看具体选型方法 →介绍的制作与核对状态
介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。
审核声明: [email protected] · 2026-10-05
查看当时使用的来源资料
SHA-256: ec0aee015d77310155f4476b16998c1b0328090ba26193600a0edeae37bb637d
2026-10-05T02:55:26.901Z
来源文件 / 仓库# bright-academy A FreeWebStore template for **education.academy** by **@serge-ivo**. Warm, light, high-trust landing page for **education programs** — after-school academies, tutoring centres, music and language schools, chess and sports clubs, and school-run enrichment programs. Fills the education gap in the FWS library, which was previously all local-service verticals and portfolios. ## Design - **Palette** — cream `#fdfbf7` page, indigo-950 structure bands, amber-300 accent. Light-first, because parents and school staff read this on a phone in daylight, not a dark dashboard. - **Type** — system stack, `font-black` headings, `leading-8` body. No web fonts, so the page paints instantly with no external font request. - **No JavaScript.** The mobile nav and the FAQ accordion are native `<details>` elements — nothing to break under a strict CSP, and it still works with JS disabled. - **Accessibility** — skip link, labelled form controls, `aria-hidden` on decorative glyphs, alt text on the hero image, visible focus styles. ## Sections `hero` · `programs` · `how` (3 steps) · `who` (students / parents / schools) · `pricing` (3 plans) · `stories` (testimonials) · `faq` · `contact` (details + trial-request form) · footer. Each is a top-level `<section id="...">`, so the platform splits them into independently editable sections at deploy time. ## Slots Universal set: `business.name`, `business.tagline`, `about.body`, `contact.phone`, `contact.email`, `contact.address`, `contact.hours`, `fws.byline`. See `slots.md`. ## Vibecoding this template Open `index.html` in your editor of choice (Claude Code, Cursor, Windsurf, plain VS Code with an AI sidebar) and iterate. Constraints: - **HTML + Tailwind utility classes only.** No templating engines, no framework, no build step. - **Slot markers (`data-fws-slot="..."`) mark customization points.** - **Single-page output.** FWS produces one HTML file per business. Multi-page is a PWS feature, not FWS. Regenerate `preview.png` (1280×720, ≤500KB) after visual changes: ```sh "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" \ --headless --disable-gpu --hide-scrollbars --window-size=1280,720 \ --screenshot=preview.png "file://$PWD/index.html" ``` ## Publishing ```sh npx @freewebstore/cli doctor # local validation npx @freewebstore/cli login # one-time GitHub App install npx @freewebstore/cli publish # upload + create repo + queue for review ``` ## License MIT.
看看同类模板
对比同技术栈与用途的模板,找到更适合的视觉与内容结构。

mazer
Free and Open-source Bootstrap 5 Admin Dashboard Template and Landing Page
HTML · 后台

Freelancer
Freelancer 是 Start Bootstrap 出品的单页作品集模板,专为自由职业者、设计师和小型工作室设计。 页面结构清晰,包含多个内容区块、响应式作品集网格,每个作品项目配有模态窗口展示详情。
HTML · 作品集

Creative
Creative 是 Start Bootstrap 团队维护的一款单页营销模板,定位明确:为创意机构或产品服务提供一个以作品展示和行动号召为核心的落地页。
HTML · 企业官网

startbootstrap-agency
Agency 是 Start Bootstrap 维护的单页代理商作品集主题,基于 Bootstrap 构建,MIT 许可。
HTML · 企业官网

startbootstrap-landing-page
这是 Start Bootstrap 系列中一款通用型落地页模板,基于 Bootstrap 构建,定位是给产品或服务做单页推广。
HTML · 企业官网

Landing-Page
Tailwind CSS Starter Template - Landing Page
HTML · 企业官网
