Long Table
FreeCreate warm, engaging HTML presentations with ease.
Free · Opens the source repo
What Long Table does
The Long Table skill provides a cohesive HTML presentation template designed for informal, community-oriented brands. With its warm cream and rust-red aesthetic, this skill is particularly suited for events like supper clubs, small restaurant promotions, and creative studio showcases. The typography and design elements are carefully curated to create an inviting atmosphere, making it ideal for presentations that aim to foster connection and engagement.
Users can start by cloning the provided example.html file, which serves as a base for their content. The workflow emphasizes maintaining the integrity of the design system, which includes specific fonts, colors, and decorative elements that contribute to the overall identity of the presentation. By following the structured approach outlined in the skill, users can effectively replace placeholder content with their own while ensuring that the visual style remains consistent. This skill encourages creativity within a defined framework, allowing for adjustments in slide count and layout while adhering to the established design guidelines.
The Long Table skill is particularly useful for professionals in the hospitality and lifestyle sectors who need to create visually appealing presentations quickly. It is also beneficial for anyone looking to present data and insights in a more engaging format, as the design promotes readability and aesthetic appeal. However, users should be aware that this skill is not intended for corporate or highly technical presentations, as its warm and informal style may not convey the necessary professionalism required in those contexts.
Overall, the Long Table skill offers a unique solution for creating modern, visually appealing presentations that resonate with audiences seeking a more personal touch. Its structured yet flexible approach ensures that users can produce high-quality decks without sacrificing design integrity.
When to use it
Use this skill when you need to create a presentation that feels warm and inviting, particularly for community-focused events or lifestyle brands.
When not to use it
Avoid this skill for presentations that require a corporate or technical tone, as the design is intentionally warm and informal.
What you can build with it
Supper Club Event
Create an engaging presentation for a supper club event, showcasing the menu and atmosphere.
Creative Studio Pitch
Use the Long Table skill to present your creative studio's portfolio in a warm, inviting format.
Lifestyle Brand Launch
Design a captivating launch presentation for a new lifestyle brand that resonates with your target audience.
How to install Long Table
View source1. Install with the skills CLI
npx skills add nexu-io/open-design/html-ppt-zhangzara-long-table --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-ioLong Table
Warm cream and rust-red supper-club aesthetic with bold uppercase grotesk headlines, italic Fraunces, and pill-shaped outlined buttons.
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
- Density: medium
- Slides in demo: 8
Best for
Anything that should feel like a warm, intimate, modern hospitality / community brand: supper clubs, dinner series, small restaurants, creative-studio events, membership pitches, lifestyle and wine brands. Equally good for any deck wanting a single warm accent colour, italic-meets-bold typography, and a social-media-aware modern-editorial voice.
Avoid for
Decks that need corporate polish, technical density, or a cold / minimalist register — the rust-red palette and bold-italic mix are intentionally warm and people-facing.
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-long-table" 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 Long Table
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.