纯 HTML/CSS/JS 实现,无构建工具与依赖,可直接在浏览器打开
inkognito-pen.com — HTML 电商模板
作者 kaifgit-code
INKOGNITO 是一个面向钢笔品牌的 Gen-Z 风格电商展示网站,使用纯 HTML/CSS/JS 编写,可直接部署到 GitHub Pages。
看看你的网站会是什么样
浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。
全部页面与视图 2
截图用于了解视觉与布局,交互效果请以实际项目为准。
值得关注的模板亮点
从已有项目资料中,快速了解它的特点。
单页结构覆盖首页、分类、优惠、评价与支持等板块
产品图用纯 CSS 绘制,除 logo 外无需外部图片资源
script.js 提供移动端菜单、滚动联动标签与 Buy Now 提示
README 给出 GitHub Pages 免费部署的完整步骤
模板详细介绍
该项目是钢笔品牌 INKOGNITO 的静态电商展示站点,主题风格面向年轻用户,口号为“Likha toh likha, kisne likha?”。页面内容集中在单个 index.html 中,覆盖首页、分类、优惠、评价与支持等板块;style.css 负责主题、布局、光泽按钮与动画;script.js 实现移动端菜单、基于滚动的活动标签切换以及“Buy Now”提示。项目不依赖构建工具与第三方包,本地双击 index.html 或用 python3 -m http.server 即可预览,也可按 README 步骤上传到 GitHub 仓库并通过 Settings → Pages 从 main 分支根目录发布。产品图片全部用纯 CSS 绘制,除品牌 logo 外不需要外部图片文件;字体从 Google Fonts 加载。需要注意的是,“Buy Now”按钮目前只弹出加入购物车的确认提示,并未接入真实购物车或支付流程,README 建议后续对接 Razorpay、Instamojo 等支付服务。仓库采用 MIT 许可,免费范围限于该版本代码,演示图片、字体、图标等第三方素材需按各自许可核对。
适合你的项目吗?
适用场景
- 作为学生前端练习项目,学习静态页面结构与交互脚本
- 作为钢笔或文具品牌的展示型官网起点
- 用于演示 GitHub Pages 静态托管与部署流程
- 作为电商页面原型的视觉与交互参考
适合人群
- 想学习纯 HTML/CSS/JS 组织方式的前端初学者
- 需要快速搭建品牌展示页的个人或小团队
- 准备用 GitHub Pages 托管静态站点的开发者
上手与定制指南
结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。
- 1
本地预览可直接双击 index.html,或在目录中运行 python3 -m http.server 8000 后访问 http://localhost:8000
- 2
部署时将 index.html、style.css、script.js 与 assets/ 上传到仓库根目录,在 Settings → Pages 选择 main 分支 /(root) 发布
- 3
Buy Now 按钮仅显示加入购物车提示,实际销售前需自行接入购物车与支付服务
- 4
字体从 Google Fonts 加载,离线或受限网络环境下可能无法正常显示
- 5
除 logo 外的演示素材需按各自许可核对,MIT 许可仅覆盖代码本身
授权与来源资料
使用条件与限制
免费使用 · 保留许可声明本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。
使用时需要遵守
- 允许免费使用、修改、商用和分发该版本代码。
- 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
- 代码按现状提供;担保与责任限制以原许可证及适用法律为准。
额外费用与待核对事项
- 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
- 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
- “Buy Now”按钮目前仅显示加入购物车的确认提示,并未接入真实购物车或支付流程;如需实际销售,需自行对接 Razorpay、Instamojo 等支付服务。
- 字体从 Google Fonts 加载,属于外部服务依赖;离线或受限网络环境下可能无法正常显示。
- 除品牌 logo 外,产品图片均以纯 CSS 绘制,不依赖外部图片文件;logo 需自行提供。
查看原文依据
Permission is hereby granted, free of charge
许可证原文
"Buy Now" buttons currently just show an "added to cart" confirmation — hook them up to a real cart/payment provider (e.g. Razorpay, Instamojo) when you're ready to actually sell.
README 原文
Fonts (`Baloo 2`, `Poppins`) load free from Google Fonts.
README 原文
https://github.com/kaifgit-code/inkognito-pen.com/blob/main/LICENSEhttps://github.com/kaifgit-code/inkognito-pen.com/blob/main/README.mdAll product images are drawn with pure CSS (no external image files needed except the logo) so the site loads fast.
README 原文
DeepSeek 根据仓库许可证和 README 整理 ·2026-10-13。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。
项目核对记录与介绍依据
模板资料
- 来源平台
- GitHub
- 资料与维护参考分
- 资料较完整 · 80 / 100
- 技术栈
- HTML
- 网站类型
- 电商
这个分数如何计算
本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。
这个项目需要核对什么
- 记录的仓库更新时间
- 2026-08-17
- 截图检查日期
- 2026-10-13
已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。
目录记录的主要技术栈是 HTML。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。
查看具体选型方法 →介绍的制作与核对状态
介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。
审核声明: [email protected] · 2026-10-13
查看当时使用的来源资料
SHA-256: 400906e5c36af9c6dcc726839de221a8a9a3927c7246d7628422c2b451a8c99a
2026-10-13T09:22:53.795Z
来源文件 / 仓库# INKOGNITO — Likha toh likha, kisne likha?
A fun, Gen-Z themed website for the INKOGNITO pen brand. Pure HTML/CSS/JS — no build tools, no dependencies. Free to host on GitHub Pages.
## Files
- `index.html` — all page content (Home, Category, Offers, Reviews, Support)
- `style.css` — theme, layout, glossy buttons, animations
- `script.js` — mobile menu, scroll-based active tab, "Buy Now" toast
- `assets/logo.png` — brand logo (used as navbar logo, favicon, footer logo)
## How to run locally
Just double-click `index.html`, or in a terminal:
```
cd inkognito
python3 -m http.server 8000
```
Then open `http://localhost:8000`.
## How to deploy on GitHub Pages (free)
1. **Create a new GitHub repo** (e.g. `inkognito-website`) — public.
2. **Upload these files** to the repo root: `index.html`, `style.css`, `script.js`, and the `assets/` folder (with `logo.png` inside).
- Easiest way: on the repo page, click **Add file → Upload files**, drag all files/folders in, and commit.
- Or via git:
```
git init
git add .
git commit -m "Initial commit - INKOGNITO website"
git branch -M main
git remote add origin https://github.com/<your-username>/inkognito-website.git
git push -u origin main
```
3. Go to your repo **Settings → Pages**.
4. Under **Build and deployment → Source**, choose **Deploy from a branch**.
5. Under **Branch**, select `main` and folder `/ (root)`, then **Save**.
6. Wait 1–2 minutes. Your site will be live at:
```
https://<your-username>.github.io/inkognito-website/
```
That's it — 100% free hosting, no server needed.
## Notes
- All product images are drawn with pure CSS (no external image files needed except the logo) so the site loads fast.
- Fonts (`Baloo 2`, `Poppins`) load free from Google Fonts.
- "Buy Now" buttons currently just show an "added to cart" confirmation — hook them up to a real cart/payment provider (e.g. Razorpay, Instamojo) when you're ready to actually sell.
看看同类模板
对比同技术栈与用途的模板,找到更适合的视觉与内容结构。

uikit-ecommerce-template
E-commerce template built with UIKIt
HTML · 电商

Shop Homepage
Shop Homepage 是 Start Bootstrap 发布的一款基础 HTML 商店首页模板,核心结构围绕顶部导航、商品网格和页脚展开。
HTML · 电商

ludus-free-premium-ecommerce-template
🛒 Ludus - Multipurpose E-commerce Template - 40+ Pages, User Dashboard Module & Blog Module
HTML · 后台

shoe_store
This is a Shoe-Store eCommerce website template using HTML and CSS and JS.
HTML · 电商

LeatherHoard
A basic template for e-commerce website, designed with HTML, CSS and Bootstrap.
HTML · 电商

vex-bootstrap
Vex 是 Themefisher 推出的一款干净、多用途的电商 HTML 模板,目标用户是希望快速搭建在线商店的站长。
HTML · 电商
