Skip to content

Marketing Poster Designer

Turns content into a bold 1080×1920 vertical poster for social sharing

Stars
9,376
Licence
Apache-2.0
Files
3 files

What it does

This skill teaches an AI agent a specific layout template for vertical marketing posters, the tall 9:16 format used for WeChat Moments-style shares. Once installed, when you ask for a poster, the agent builds an HTML page with a full-screen gradient background, a large headline, a short subtitle, a card of three to five key points with icons, a placeholder QR code area, and decorative SVG shapes. The template is written in Chinese and the example is a product launch poster.

Great for

  • Marketers who need a quick, eye-catching vertical promo image for social media
  • Designers wanting a starting layout with bold gradients and large type
  • Small teams producing launch announcements without a designer

Skip it if

  • Print posters or formats other than 1080×1920, since the layout is fixed to that size
  • Brand-sensitive work needing exact brand assets or fonts, because the template uses generic Tailwind colours and a placeholder QR code

Try asking

  • “Make a 1080x1920 poster announcing our new product launch with three key features”
  • “Create a vertical social share image for our summer sale with a bold gradient background”
  • “Design a WeChat Moments poster for our webinar with a QR code placeholder”
Step-by-step guide: how to use Marketing Poster DesignerInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 3 original files, the Apache-2.0 licence and an attribution note.

    poster-hero.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip poster-hero.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip poster-hero.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Give the agent your headline, subtitle and three to five key points up front so the text fits the template
  • Ask for a specific accent colour if you need to match your brand, since the default is a violet-to-indigo gradient
  • Replace the QR code placeholder with a real code before publishing

What's inside

  • example.html
  • example.md
  • SKILL.md

Redistributed unmodified from nexu-io/html-anything under the Apache-2.0 licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.