Poster Hero
Turn launch or campaign copy into a bold 1080×1920 vertical poster or Moments-style share image without designing from scratch.
Overview
poster-hero is an agent skill most often used in Launch (also Grow content and Validate landing experiments) that renders vertical 9:16 marketing posters and Moments-style share images from the open-design HTML template.
Install
npx skills add https://github.com/nexu-io/open-design --skill poster-heroWhat is this skill?
- Fixed 1080×1920 (9:16) canvas with mesh gradients, noise texture, and high-contrast typography
- Layout recipe: top whitespace + hero emoji/geometry, center text-8xl headline, 3–5 icon bullet cards, brand/QR footer
- Open-design / html-anything prototype mode with debounced HTML preview reload
- i18n example prompts (zh-CN / en) and real-content guardrails—no lorem ipsum or placeholder images
- Tagged for poster, 朋友圈, and marketing scenario with sample launch poster example
- 1080×1920 vertical canvas
- 3–5 icon bullet highlights in layout recipe
Adoption & trust: 737 installs on skills.sh; 61.4k GitHub stars; 3/3 security scanners passed (skills.sh audits).
What problem does it solve?
You have launch copy and offers but no fast way to produce a consistent, high-impact vertical share image for social channels.
Who is it for?
Solo builders shipping a product update who need a polished 朋友圈 or story-format poster in one agent session from markdown or brief copy.
Skip if: Teams that need a full design system, multi-page decks, or automated ad-platform sizing beyond the fixed vertical poster recipe.
When should I use this skill?
When you want a vertical poster or Moments-style share image with strong visual impact from real content using the Marketing Poster template.
What do I get? / Deliverables
You get a styled 1080×1920 HTML poster with headline, bullets, and brand/QR placeholders filled with your real content, ready to preview and export for distribution.
- index.html poster prototype at 1080×1920
- Branded share graphic layout with headline, bullets, and QR/brand slot
Recommended Skills
Journey fit
Spans multiple journey phases - primary shelf plus alternate fits below.
Shareable posters are a canonical Launch distribution artifact for solo builders announcing ships and offers. Distribution subphase covers social and share-channel creatives; poster-hero targets high-impact vertical share formats.
Where it fits
Ship a product-release poster with QR placeholder for your community channel the same day you tag the release.
Refresh a campaign poster with new stats while keeping the violet–fuchsia gradient visual signature.
A/B positioning by generating two poster variants with different headlines before committing landing page hero copy.
How it compares
Use this HTML poster template when you already have messaging; use a landing-page-generator skill when you still need acquisition page structure and funnel copy.
Common Questions / FAQ
Who is poster-hero for?
poster-hero is for solo and indie builders using Claude Code, Cursor, or similar agents who market on social and chat apps and want a repeatable vertical poster layout without manual design work.
When should I use poster-hero?
Use it at Launch for distribution posts, during Grow for campaign refreshes, or in Validate when testing positioning with shareable creatives—whenever you need a 9:16 poster with real copy, not placeholders.
Is poster-hero safe to install?
Review the Security Audits panel and file permissions on this Prism catalog page before installing; the skill focuses on local HTML prototyping and does not imply third-party install statistics.
SKILL.md
READMESKILL.md - Poster Hero
【模板: 营销海报】 - 容器 `w-[1080px] h-[1920px] mx-auto`, 全屏渐变 / mesh 背景。 - 上部 30% 留白 + 一个大 emoji 或抽象几何图形。 - 中部主标题占视觉中心 (text-8xl, font-black), 一句话副标题。 - 下部信息卡片: 3-5 条核心要点用图标 + 短句。 - 底部右下角放品牌 / 二维码 (用 SVG 占位)。 - 使用大胆的色彩: 渐变背景 (from-violet-500 via-fuchsia-500 to-indigo-500 之类), 文字白色 + 1 个对比色高亮。 - 使用 SVG 做装饰性元素 (圆 / 三角 / 波浪 / 噪点纹理)。