/card-xiaohongshu
小红书风格知识卡片, 多张联排可滑动浏览
Claude Code
$ npx -y skills add nexu-io/html-anything --skill card-xiaohongshu --agent claude-code
Codex
$ npx skills add nexu-io/html-anything --skill card-xiaohongshu -a codex -y
Cursor
$ npx skills add nexu-io/html-anything --skill card-xiaohongshu -a cursor -y
Gemini CLI
$ npx skills add nexu-io/html-anything --skill card-xiaohongshu -a gemini-cli -y
GitHub Copilot
$ npx skills add nexu-io/html-anything --skill card-xiaohongshu -a github-copilot -y
OpenCode
$ npx skills add nexu-io/html-anything --skill card-xiaohongshu -a opencode -y
Windsurf
$ npx skills add nexu-io/html-anything --skill card-xiaohongshu -a windsurf -y
SKILL.md
card-xiaohongshu.SKILL.mdname: card-xiaohongshu zh_name: "小红书图文卡片" en_name: "Xiaohongshu Card" emoji: "📱" description: "小红书风格知识卡片, 多张联排可滑动浏览" category: card scenario: marketing aspect_hint: "1080×1440 (3:4)" featured: 24 tags: ["xhs", "小红书", "carousel", "图文"] example_id: sample-xhs-ai-habits example_name: "小红书图文卡 · AI 工具习惯" example_format: markdown example_tagline: "7 张连排, 莫兰迪渐变" example_desc: "干货卡片合集, 适合截图发小红书 / 朋友圈"
【模板: 小红书图文卡片】
- 输出 N 张连续卡片, 每张 `w-[1080px] h-[1440px]`, 用 flex 纵向排列方便整体截图也方便单张截图。N 由【用户内容】信息量决定: 短内容 3-6 张起步, 长内容应更多 (小红书平台单帖最多 18 图, 通常 9 张以内最佳); 一张卡只承载一个核心观点。
- 第一张是封面: 巨大的标题 + 1 行副标题 + 一个吸引人的标签 (类似 "干货预警" / "建议收藏")。
- 中间几张展开正文, 每张一个核心观点, 配 emoji + 短句 + 1-2 个例子。
- 最后一张是总结 + 行动号召 (关注 / 收藏 / 评论)。
- 配色: 选择柔和的莫兰迪色或粉色系; 元素圆润, 大量留白。
- 字号大、行距宽、对比强(小红书在手机上看, 小字根本看不清)。
- 每张卡片右下角小水印 (作者名 / 日期)。
From the team behind Open Design — 40k★ · 200+ contributors, production-grade and iterating faster. html-anything is the focused agent-era HTML editor; if it clicks for you, Open Design is where the same team ships at scale.
Other skills on html-anything.
article-sketchnote-edi…
把一个概念铸成杂志专题档案——真问题→失败→转折→顿悟→命名, 6 个 layout 模具 + 4 字族对比 + 探案档案细节
More skills from other plugins.
prompt-lookup
Activates when the user asks about AI prompts, needs prompt templates, wants to search for prompts, or mentions prompts.chat. Use…
ppt-master
AI-driven presentation workflow for generating editable PPTX decks and slides, reconstructing page visuals, creating reusable…
morph-ppt
Use this skill when the user wants a .pptx with smooth cross-slide animation — PowerPoint Morph transitions, Keynote-style…
frontend-slides
Create stunning, animation-rich HTML presentations from scratch or by converting PowerPoint files. Use when the user wants to…
Questions about card-xiaohongshu.
- Which coding agents can use card-xiaohongshu?
- card-xiaohongshu installs in Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode and Windsurf with the skills CLI, using each agent's flag shown on this page. Flowy's auto-invocation, which fires a skill when your prompt matches, runs in Claude Code only.

