mcpField
H
html-ppt-zhangzara-8-bit-orbit

html-ppt-zhangzara-8-bit-orbit

github.com/nexu-io文档处理104.6k59 次安装今天更新
代码仓库

关于 html-ppt-zhangzara-8-bit-orbit

用于制作 8-bit 霓虹街机风格演示文稿的 HTML 技能,适合追求复古数字视觉效果的创作者。它指导如何替换模板内容,同时保留整体设计系统和导航运行逻辑。

主要功能

  1. 01暗色像素霓虹风格
  2. 02独立 HTML 演示模板
  3. 03替换幻灯片内容的指引
  4. 04可复制或删除版式
  5. 05保留导航运行逻辑的说明

适用场景

  1. 01赛博朋克或游戏主题演示
  2. 02黑客松或独立开发工具展示
  3. 03复古数字风格技术演讲

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/nexu-io/open-design --skill html-ppt-zhangzara-8-bit-orbit

安装后在 Claude Code 中输入/html-ppt-zhangzara-8-bit-orbit确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

example.html
LICENSE
template.json

详细介绍

8-Bit Orbit

深海军蓝虚空中的像素艺术霓虹街机美学。

一套独立完整的 HTML 幻灯片:字体、配色、装饰系统和幻灯片用语都经过协同调校。混用不同模板的布局会破坏这套系统;请始终遵循这一套设计。

概览

  • 配色方案: 深色
  • 正式程度: 低
  • 信息密度: 中
  • 演示幻灯片数量: 10

适用场景

任何适合营造凌晨 2 点 CRT 屏幕氛围的内容:赛博朋克、游戏、web3、独立开发工具、黑客马拉松演示。同样适合融入怀旧数字工艺感的技术演讲、合成器浪潮风格的品牌演示文稿,或希望呈现游戏机氛围的创意评审。

不适用场景

深色霓虹配色会明显削弱信息传达效果的场合,例如风格沉静的机构金融披露、面向患者的医疗材料、传统奢侈品。

工作流

  1. 将 example.html 克隆到用户的工作区,作为工作文件。
  2. 用用户的实际内容替换占位内容,包括标题、正文、数字、名称、日期和章节标签。替换图片占位符时,请匹配现有尺寸。
  3. 保留设计系统。 切勿替换字体、重新着色、重构布局网格,或移除装饰元素(角括号、纸张颗粒、几何形状、插画式 SVG)。它们是整体风格的一部分。
  4. 通过复制布局调整演示文稿长度。 如果用户的内容比演示示例更多,请复制布局最合适的现有幻灯片。如果内容较少,请从末尾删除幻灯片。更新页码标签。
  5. 设计缺失的布局: 如果幻灯片需要模板中没有的布局,请使用相同的字体、配色、装饰元素、间距节奏和组件规则从头设计,切勿改用其他模板。
  6. 保持导航运行时代码原样。 如果演示文稿附带 assets/deck-stage.js 或内联键盘处理程序,请保持不变。

输出规范

在 <artifact> 标签之间输出:

<artifact identifier="zhangzara-8-bit-orbit" 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