关于 html-ppt-zhangzara-pink-script
用于制作深色编辑风格 HTML 演示文稿的技能,采用亮粉色点缀与奶油色纸张质感。它指导替换内容并保留模板的视觉系统和导航运行时。
主要功能
- 01深色搭配亮粉色点缀
- 02编辑风格衬线字体
- 03可复用的幻灯片布局
- 04键盘导航运行时
- 05HTML 输出与制作流程
适用场景
- 01时尚与奢侈品展示
- 02夜生活或烈酒发布演示
- 03编辑专题与创作者品牌
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ nexu-io/ open-design --skill html-ppt-zhangzara-pink-script安装后在 Claude Code 中输入/html-ppt-zhangzara-pink-script确认已加载。
包含的文件
除 SKILL.md 外,安装时一起下载的参考资料和脚本。
example.htmlLICENSEtemplate.jsonassets/deck-stage.js详细介绍
Pink Script — After Hours
黑色画布、亮粉色点缀、珍珠奶油色纸张、Instrument Serif 标题:深夜编辑式奢华。
一套独立完整的 HTML 幻灯片——排版、配色、装饰系统和幻灯片元素都经过整体调校。混用不同模板的布局会破坏整个系统;请始终遵循这一套设计。
一览
- 配色方案: 深色
- 正式程度: 中高
- 信息密度: 低
- 演示中的幻灯片数: 9
适用场景
适合任何需要营造夜色氛围、精心构思且略带奢华感的内容:时尚品牌演示文稿、创作者个人品牌、深夜/夜生活/烈酒新品发布、奢侈品展示、编辑专题。对于希望展现强大魅力与自信的技术主题演讲、研究综述或商业推介来说,这也是一个令人眼前一亮的意外之选。
不适用场景
不适合日间企业专业场合和传统 B2B 场景,因为黑色画布搭配亮粉色点缀会显得过于刻意或张扬。
工作流
- 将
example.html和assets/文件夹一起克隆到用户的工作区。 此模板附带assets/deck-stage.js运行时(键盘导航、舞台渲染);HTML 将其引用为assets/deck-stage.js,因此该文件必须与克隆的 HTML 放在一起,否则在生成的产物中该路径会返回 404,导航也会悄然失效。如果希望使用单个独立文件,也可以将 JS 内联到 HTML 的一个<script>代码块中。 - 将占位内容替换为用户实际使用的标题、正文、数字、名称、日期和章节标签。替换图片占位符时,尺寸应与原有尺寸一致。
- 保留设计系统。切勿替换字体、修改配色、重构布局网格或删除装饰元素(角括号、纸张纹理、几何形状、插画 SVG)。它们都是设计标识的一部分。
- 通过复制布局调整幻灯片数量。如果用户的内容多于演示模板所能容纳的数量,就复制最适合的现有幻灯片布局;如果内容较少,就从末尾删除幻灯片。更新页码标签。
- 设计缺失布局:如果某张幻灯片需要模板中没有的布局,请使用相同的字体、配色、装饰元素、间距节奏和组件规范从头设计,切勿改用其他模板。
- 保持随附的导航运行时不变。如果演示文稿附带
assets/deck-stage.js或内联键盘处理程序,请保持原样。
输出约定
在 <artifact> 标签之间输出:
<artifact identifier="zhangzara-pink-script" type="text/html" title="Deck Title">
<!doctype html>
<html>...</html>
</artifact>
来源与许可
移植自上游采用 MIT 许可的
zarazhangrui/beautiful-html-templates。
完整的上游 MIT 许可文本(包括原始版权声明)随此技能一并提供,位于
LICENSE,并且必须与任何 example.html、template.json 副本或任何移植的 assets/ 运行时一同再分发。上游元数据快照请参见 template.json。
评论
支持 Markdown