Verified:GitHub

html-ppt-xhs-post

Generates 9-page 3:4 vertical HTML carousel decks for Xiaohongshu and Instagram posts.

Updated May 20, 2026

Search Tags:#social media #content creation #xiaohongshu #html deck #instagram carousel #carousel template #vertical slides

One-click install

npx skills add https://github.com/Keimoshi/Silverloft --skill html-ppt-xhs-post-keimoshi

Or copy as Structured Prompt for Agent▼

Please help me install this Agent Skill.
Skill: html-ppt-xhs-post
Source: https://github.com/Keimoshi/Silverloft/tree/main/open-design-port/skills/html-ppt-xhs-post
Command: npx skills add https://github.com/Keimoshi/Silverloft --skill html-ppt-xhs-post-keimoshi

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Creating visually consistent multi-page image carousels for Xiaohongshu (RED) or Instagram requires design tooling and manual layout work; this Skill produces a complete 9-page 810×1080 vertical HTML deck with a warm pastel sticker-card visual identity from a single prompt. ## Core Features & Use Cases - Fixed 3:4 vertical deck template: Ships the `xhs-post` full-deck template with 810×1080 slides, dashed-border sticker cards, page-dot indicators, and bottom page bars. - Structured 9-page narrative: Cover, hook, pain point, insight, three steps, result, and CTA pages with hashtag rows and avatar footer. - Theme and runtime support: Inherits the html-ppt master skill's 36 swappable themes, animation classes, speaker notes, and keyboard navigation runtime. - Use Case: A content creator asks for a 9-page Xiaohongshu post about sleep habits and receives a ready-to-publish HTML carousel with cover, content pages, and a follow/CTA ending. ## Quick Start Ask the AI to use the html-ppt-xhs-post template to create a 9-page 3:4 vertical Xiaohongshu carousel on your chosen topic with a cover, seven content pages, and a closing CTA.

Frequently Asked Questions about html-ppt-xhs-post

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I create a Xiaohongshu carousel post with HTML?▼

Use this template to generate a 9-page 810×1080 vertical HTML deck with cover, content, and CTA pages. Copy the xhs-post template files into your project, keep the .tpl-xhs-post body class, and replace the demo text with your own content.

What size should Xiaohongshu image posts be?▼

This template uses the standard 3:4 vertical ratio at 810×1080 pixels per page. Each slide is a fixed-size card designed for direct export or screenshot as carousel images.

Why is my copied deck not navigating between slides?▼

The upstream template links shared CSS and JS via ../../../assets/ paths that break once copied out of the skill tree. Either copy fonts.css, base.css, animations.css, and runtime.js into a project-local assets folder and rewrite the paths, or inline their contents directly into index.html.

Can I change the color theme of the xhs-post template?▼

Yes, the deck inherits the html-ppt theme system with 36 themes in assets/themes/*.css. Swap the theme via the theme-link stylesheet tag and press T to cycle through options.

Where do speaker notes go in the HTML deck?▼

Place speaker notes inside <aside class="notes"> or <div class="notes"> elements. They are hidden from the audience view by CSS and only appear in presenter mode.