Piku - 创意 Saas 和软件 HTML5 模板 preview 1

Piku - 创意 Saas 和软件 HTML5 模板

bookmark

Piku 是一款专为 SaaS 和软件类产品设计的 HTML5 落地页模板，提供浅色和深色两套主题，包含 10 种首页变体，适用于 AI 写作工具、CRM、项目管理、支付服务等软件产品的展示页面。

HTMLagencyaiai writerapp landingcreativecrmdark

项目简介

Piku 是一款专为 SaaS 和软件类产品设计的 HTML5 落地页模板，提供浅色和深色两套主题，包含 10 种首页变体，适用于 AI 写作工具、CRM、项目管理、支付服务等软件产品的展示页面。

技术栈

  • HTML5
  • Bootstrap v5.3.1
  • SASS
  • Vanilla JavaScript

项目结构

text
Template/
├── piku/           # 浅色主题
│   ├── css/        # 样式文件（含 style.min.css、responsive.css）
│   ├── js/         # JS 文件
│   ├── images/     # 图片资源
│   ├── fonts/      # 字体图标
│   ├── scss/       # SASS 源文件
│   ├── vendor/     # 第三方插件
│   ├── inc/        # 表单处理文件
│   ├── index*.html # 10 种首页变体
│   ├── login.html
│   └── ...         # about、blog、pricing、service 等页面
└── piku-dark/     # 深色主题（结构相同）

核心文件说明

  • Template/piku/index.html — 默认首页，聚合 Payment Service 场景
  • Template/piku/index-2.html — AI Writer 首页变体
  • Template/piku/index-4.html — CRM 首页变体
  • Template/piku/css/style.min.css — 合并后的主样式文件
  • Template/piku/scss/ — SASS 源文件，可自定义编译
  • Template/piku-dark/ — 与浅色主题结构一致，仅颜色方案不同

快速开始

  1. 解压压缩包，进入 Template/piku/ 目录
  2. 直接用浏览器打开 index.html 预览效果
  3. 上线时将 piku 文件夹整体上传至服务器即可

使用建议

模板各 index*.html 首页风格差异较大，建议根据产品定位选择对应变体，再替换 Logo、文案和图片。深色主题 (piku-dark/) 可直接复制浅色结构，便于后续扩展。

help_outline

常见问题