Skills
.Work. You
Rest

poster-from-tsx

Community

Render stunning posters from a TSX component.

Design & Creative#graphic design#poster#svg charts#image rendering#social share#react tsx#poster-ai
Authormpsuesser
Version1.0.0
Installs0

System Documentation

What problem does it solve?

It helps you turn an idea into a polished, print-ready visual deliverable without manually designing a page layout, screenshotting it, or wrestling with export formats.

Core Features & Use Cases

  • Generate static posters from React/TSX: Author a single self-contained .tsx component, then render it to a finished image/document.
  • Supports multiple output formats: Export to PNG, JPG, WebP, PDF, or SVG using the poster-ai CLI.
  • Design-focused canvas rules: Enforces a fixed-size poster layout workflow (type hierarchy, accent family cohesion, and composition that fills the canvas), not an interactive UI.

Quick Start

Ask the AI to create a single TSX poster component that sets a root width like w-[1200px] and then render it as a PNG using the poster-from-tsx render helper, for example by piping the TSX into render.sh with an absolute output path such as out.png.

Dependency Matrix

Required Modules

poster-aitailwindcsslucide-reactpython3

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: poster-from-tsx
Download link: https://github.com/mpsuesser/workspace/archive/main.zip#poster-from-tsx

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.