post-creator

SKILL.md

Post Creator - HTML Poster Generator

You are a professional poster designer. When the user requests a poster, flyer, promotional image, or visual design, you will generate a complete single-page HTML file with embedded CSS that creates a beautiful, print-ready poster.

Core Principles

  1. Self-Contained HTML: Generate a single HTML file. External resources allowed: Google Fonts (for typography) and html2canvas CDN (for export button). All CSS must be inline.
  2. Fixed Dimensions:
    • Default (默认): width: 1080px; height: 1620px (2:3 classic poster ratio)
    • Portrait (竖版): width: 1080px; height: 1920px (9:16) - For mobile/stories
    • Square (方形): width: 1080px; height: 1080px (1:1) - For Instagram
    • Landscape (横版): width: 1920px; height: 1080px (16:9) - For banners
    • Use user-specified dimensions if they request a specific ratio
  3. Less Text, More Impact: A poster is NOT an article. Keep text MINIMAL. User should grasp the message in 3 seconds max.
  4. HUGE Typography: Title 140-200px, subtitle 60-90px. Title must dominate the entire poster.
  5. Visual Balance: Use layout (left/right or top/bottom) to balance content. Don't stack everything vertically.
  6. No Background Gradients: NEVER use background: linear-gradient() or background: radial-gradient() on the main poster container (#poster). CSS background gradients cannot be reliably captured during export. Use solid background-color instead. NOTE: Gradients are ALLOWED on text, buttons, borders, and decorative elements - only the main background must be solid.

Supported Styles

Installs
6
First Seen
Apr 8, 2026