html-ppt-zhangzara-neo-grid-bold
Compare original and translation side by side
🇺🇸
Original
English🇨🇳
Translation
ChineseNeo-Grid Bold
Neo-Grid Bold
Editorial neo-brutalism with a single neon yellow accent on off-white paper.
A single self-contained HTML deck — typography, palette, decorative system,
and slide vocabulary are all tuned together. Mixing layouts across templates
breaks the system; stay inside this one.
采用新粗野主义编辑风格,以米白底色搭配单一霓虹黄强调色。
这是一个独立完整的HTML演示文稿——排版、配色、装饰系统和幻灯片样式均已统一调校。跨模板混合布局会破坏系统一致性,请仅使用本模板内的布局。
At a glance
概览
- Scheme: light
- Formality: medium
- Density: high
- Slides in demo: 12
- 配色方案: 浅色
- 正式程度: 中等
- 信息密度: 高
- 演示文稿包含幻灯片数: 12
Best for
适用场景
Anything that should feel confident and editorial-graphic: design-led pitches, brand work, founder talks, conference keynotes. Excellent for stat-heavy slides, comparisons, and process flows. Just as strong for tech, research, or finance when the speaker wants to read as design-led rather than corporate.
适用于需要展现自信与编辑视觉风格的内容:设计导向的提案、品牌工作、创始人演讲、会议主题演讲。尤其适合数据密集型幻灯片、对比内容和流程展示。当演讲者希望呈现设计导向而非企业风格时,也非常适用于科技、研究或金融领域。
Avoid for
避用场景
Contexts that need to feel quiet, traditional, or warm — the neon-yellow accent and uppercase display commit to a confident editorial voice.
需要营造安静、传统或温暖氛围的场景——霓虹黄强调色和大写标题字体决定了其自信的编辑风格定位。
Workflow
使用流程
- Clone AND the
example.htmlfolder into the user's workspace. This template ships anassets/runtime (keyboard navigation, stage rendering); the HTML references it asassets/deck-stage.js, so the file must sit next to the cloned HTML or that path will 404 in the generated artifact and navigation will silently break. Inlining the JS into a singleassets/deck-stage.jsblock in the HTML is an acceptable alternative when a single self-contained file is preferred.<script> - Replace placeholder content with the user's real headlines, body copy, numbers, names, dates, and section labels. Match existing dimensions when swapping image placeholders.
- Preserve the design system. Never substitute fonts, recolor the palette, restructure the layout grid, or strip decorative elements (corner brackets, paper grain, geometric shapes, illustrated SVGs). They are part of the identity.
- Adjust deck length by duplicating layouts. If the user has more content than the demo holds, duplicate an existing slide of the most appropriate layout. If less, drop slides from the bottom. Update page-number labels.
- Designing missing layouts: if a slide needs a layout the template doesn't have, design it from scratch using the same fonts, palette, decorative vocabulary, spacing rhythm, and component grammar — never bail to a different template.
- Keep the navigation runtime as shipped. If the deck ships an
or inline keyboard handler, leave it intact.
assets/deck-stage.js
- 将和
example.html文件夹克隆到用户工作区 本模板附带assets/运行时(支持键盘导航、舞台渲染);HTML文件中引用路径为assets/deck-stage.js,因此该文件必须与克隆的HTML文件放在同一目录下,否则生成的文件会出现404错误,导航功能将失效。如果更偏好单一独立文件,也可将JS代码内联到HTML的单个assets/deck-stage.js块中。<script> - 替换占位内容 将用户的真实标题、正文、数据、名称、日期和章节标签替换占位内容。替换图片占位符时请匹配原有尺寸。
- 保留设计系统 切勿替换字体、修改配色、调整布局网格或移除装饰元素(边角括号、纸张纹理、几何图形、插画SVG)。这些元素是模板标识的一部分。
- 通过复制布局调整演示文稿长度 如果用户内容超出演示文稿容量,复制最适合的现有幻灯片布局即可。如果内容较少,从底部删除幻灯片,并更新页码标签。
- 设计缺失的布局 如果需要模板中没有的幻灯片布局,请使用相同的字体、配色、装饰元素、间距规则和组件规范从头设计——切勿切换到其他模板。
- 保留原始导航运行时
如果演示文稿附带或内联键盘处理程序,请保持其完整性。
assets/deck-stage.js
Output contract
输出约定
Emit between tags:
<artifact><artifact identifier="zhangzara-neo-grid-bold" type="text/html" title="Deck Title">
<!doctype html>
<html>...</html>
</artifact>将内容包裹在标签中:
<artifact><artifact identifier="zhangzara-neo-grid-bold" type="text/html" title="Deck Title">
<!doctype html>
<html>...</html>
</artifact>Source & license
来源与许可
Vendored from upstream MIT-licensed
.
zarazhangrui/beautiful-html-templatesThe full upstream MIT license text — including the original copyright notice — ships in this skill at
and must be redistributed alongside any copy of ,
, or any vendored runtime. See for the upstream metadata snapshot.
LICENSEexample.htmltemplate.jsonassets/template.json源自上游MIT许可的。
zarazhangrui/beautiful-html-templates完整的上游MIT许可文本(包括原始版权声明)随本技能一同发布在文件中,任何、或第三方运行时的副本都必须附带该许可文本。有关上游元数据快照,请查看。
LICENSEexample.htmltemplate.jsonassets/template.json