html-ppt-zhangzara-stencil-tablet skill
A workplace-safety compliance review for a manufacturing regulator — findings, the evidence chain, and the corrective mandate. Built as a decision-grade policy briefing deck for regulator, plant leadership.
Is the html-ppt-zhangzara-stencil-tablet skill safe?
Clean: nothing in its files matched our rules. We read 5 files in the folder on 2026-09-28.
No findings.
Install the html-ppt-zhangzara-stencil-tablet skill
A skill is a folder. Copy it into your agent's skills folder and the agent loads it when the task matches its description.
git clone --depth 1 https://github.com/nexu-io/open-design.git /tmp/open-design mkdir -p ~/.claude/skills cp -r /tmp/open-design/design-templates/html-ppt-zhangzara-stencil-tablet ~/.claude/skills/html-ppt-zhangzara-stencil-tablet
In the Claude apps, zip the folder and upload it from the Skills settings. The folder on GitHub
The instructions your agent would load
SKILL.md as published, without the frontmatter. Read it on GitHub
Stencil & Tablet
Bone paper with stencil-cut headlines and a six-color earth palette: archaeology meets brand.
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.
At a glance
- Scheme: light
- Formality: medium-high
- Density: medium
- Slides in demo: 11
Best for
Anything that should feel archival, tactile, and weighty-graphic: museum and cultural-institution decks, art / architecture brands, longform research, heritage and craft brands, manifestos. A great choice anytime — including across tech and business — when you want the deck to feel like a field manual rather than a slide deck.
Avoid for
Contexts that demand digital-native polish or playful pop — the stencil-cut display and earth-tone palette commit to a deliberate analog feel.
Workflow
This template ships an assets/deck-stage.js runtime (keyboard navigation, stage rendering); the HTML references it as assets/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 single block in the HTML is an acceptable alternative when a single self-contained file is preferred.
- Clone example.html AND the assets/ folder into the user's workspace.
numbers, names, dates, and section labels. Match existing dimensions when swapping image placeholders.
- Replace placeholder content with the user's real headlines, body copy,
restructure the layout grid, or strip decorative elements (corner brackets, paper grain, geometric shapes, illustrated SVGs). They are part of the identity.
- Preserve the design system. Never substitute fonts, recolor the palette,
than the demo holds, duplicate an existing slide of the most appropriate layout. If less, drop slides from the bottom. Update page-number labels.
- Adjust deck length by duplicating layouts. If the user has more content
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.
- Designing missing layouts: if a slide needs a layout the template
assets/deck-stage.js or inline keyboard handler, leave it intact.
- Keep the navigation runtime as shipped. If the deck ships an
Output contract
Emit between tags:
<artifact identifier="zhangzara-stencil-tablet" type="text/html" title="Deck Title">
<!doctype html>
<html>...</html>
</artifact>Source & license
Vendored from upstream MIT-licensed zarazhangrui/beautiful-html-templates.
The full upstream MIT license text — including the original copyright notice — ships in this skill at LICENSE and must be redistributed alongside any copy of example.html, template.json, or any vendored assets/ runtime. See template.json for the upstream metadata snapshot.
More skills from nexu-io/open-design
- Aarticle-magazineHuashu / huashu-md-html-inspired magazine article layout for turning Markdown or notes into a polished long-form HTML essay.
- Aaudio-jingleAudio generation skill — jingles, beds, voiceover, and sound effects. Routes music requests to Suno V5 / Udio / Lyria, speech to MiniMax TTS / FishAudio / ElevenLabs V3, and SFX to ElevenLabs SFX or AudioCraft. Output is one MP3/WAV file saved to the project folder.
- Aaudio-jingleAudio generation skill — jingles, beds, voiceover, and sound effects. Routes music requests to Suno V5 / Udio / Lyria, speech to MiniMax TTS / FishAudio / ElevenLabs V3, and SFX to ElevenLabs SFX or AudioCraft. Output is one MP3/WAV file saved to the project folder.
- Ablog-postA long-form article / blog post — masthead, hero image placeholder, article body with figures and pull quotes, author byline, related posts. Use when the brief asks for "blog", "article", "post", "essay", or "case study".
- Ablog-postA long-form article / blog post — masthead, hero image placeholder, article body with figures and pull quotes, author byline, related posts. Use when the brief asks for "blog", "article", "post", "essay", or "case study".
- Abuild-testRun the project's build / typecheck / lint / test commands and emit the build.passing + tests.passing signals devloop convergence reads.
- Acard-twitterTwitter quote or data card designed to pair with a post.
- Acard-xiaohongshuXiaohongshu-style knowledge cards, arranged as a swipeable multi-card carousel.
- Aclinical-case-reportStructured medical case presentation for clinical rounds, conferences, and documentation. Generates SOAP-format or narrative case reports with physiologically accurate vitals, labs, and evidence-based plans. Use when the brief mentions "case report", "case presentation", "SOAP note", "clinical case", "ward rounds", "case summary", or "patient presentation".
- Aclinical-case-reportStructured medical case presentation for clinical rounds, conferences, and documentation. Generates SOAP-format or narrative case reports with physiologically accurate vitals, labs, and evidence-based plans. Use when the brief mentions "case report", "case presentation", "SOAP note", "clinical case", "ward rounds", "case summary", or "patient presentation".
- Acode-importRead an existing repository's structure into the project cwd as a normalised snapshot the agent can analyse without re-walking the tree on every turn.
- Acodex-interactive-capability-mapTurn a long-form article, thread, memo, or product narrative into a compact clickable capability map with a workflow loop, use-case matrix, and responsive detail panel.