Broadside Presentation Deck
FreeCreate striking bilingual presentations with ease.
Free · Opens the source repo
What Broadside Presentation Deck does
Broadside is a specialized HTML presentation deck designed for impactful marketing and product launch communications. With a dark editorial canvas highlighted by a vibrant fire orange accent, this template is tailored for medium-high formality presentations that require a dramatic flair. The typography and color palette are meticulously crafted to maintain a cohesive visual identity, making it suitable for brand manifestos, cultural pitches, and bilingual decks in English and Chinese. The design encourages users to stay within its structured layout, ensuring a consistent and professional appearance throughout the presentation.
To utilize Broadside, users start by cloning the provided example.html file into their workspace. The next step involves replacing placeholder content with actual headlines, body text, and relevant images while adhering to the design system. This means users must not alter the fonts, colors, or layout structures, as these elements are integral to the template's identity. For those needing to adjust the length of the deck, the process is straightforward: duplicate existing layouts for additional content or remove slides as necessary, ensuring that page numbers are updated accordingly.
Broadside is particularly well-suited for professionals in marketing, design, and business who need to deliver compelling narratives in a visually engaging format. It is an excellent choice for tech and research presentations that benefit from a bold, editorial style. However, it is not suitable for presentations that aim for a more subdued or traditional aesthetic, as its dramatic design may not align with those needs.
When to use it
Use Broadside when you need to create impactful presentations that require a bold visual style, particularly for marketing and product launches.
When not to use it
Avoid Broadside for presentations that require a more traditional or subtle design approach, as its dark aesthetic may not suit those contexts.
What you can build with it
Marketing Launch Presentation
Create a visually striking presentation for your product launch, capturing attention with a bold design.
Bilingual Deck for International Audiences
Use Broadside to deliver a cohesive presentation in both English and Chinese, ensuring clarity and impact.
Cultural Pitch to Stakeholders
Engage stakeholders with a dramatic and well-structured presentation that conveys your brand's vision and values.
How to install Broadside Presentation Deck
View source1. Install with the skills CLI
npx skills add nexu-io/open-design/html-ppt-zhangzara-broadside --agent claude-code2. Or install it manually
Download the skill folder and drop it into ~/.claude/skills/ for all projects, or .claude/skills/ to scope it to one repo. Restart Claude Code so it picks up the new skill.
Anthropic's agentic coding CLI, and the reference implementation of Agent Skills. Drop a skill folder into ~/.claude/skills and Claude Code loads it automatically whenever a task matches the skill's description. Claude Code docs
Inside SKILL.md
Written by nexu-ioBroadside
Dark editorial canvas with a single fire orange accent and bilingual Latin/Chinese type stack.
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: dark
- Formality: medium-high
- Density: medium
- Slides in demo: 16
Best for
Anything that should land like a broadside newspaper headline: brand manifestos, magazine and cultural pitches, design talks, bilingual EN/CN decks, founder vision statements. Also a striking pick for tech, research, or business decks that want a dramatic single-accent editorial feel.
Avoid for
Decks that need to feel quiet, warm, or institutionally traditional — the dark canvas with fire-orange accent commits to drama.
Workflow
- Clone
example.htmlinto the user's workspace as the working file. - 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
assets/deck-stage.jsor inline keyboard handler, leave it intact.
Output contract
Emit between <artifact> tags:
<artifact identifier="zhangzara-broadside" 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.
Frequently asked questions about Broadside Presentation Deck
Similar skills
PPTX HTML Fidelity Audit
Ensure your PPTX matches its HTML source perfectly.
HTML PPT Studio
Create professional HTML presentations effortlessly.
Humanize PPT
Transform raw material into presentation-ready outlines.
Replit Deck
Create visually cohesive decision decks with ease.
Open Design Landing Deck
Create engaging marketing decks with a magazine-style format.
Magazine Web Presentation
Create visually striking HTML presentations with ease.