skills.rest
fantay0312
fantay0312COMMUNITY
Explore all skills by this author →
GitHub

py-card

Convert content into PNG cards using HTML templates and Playwright.

Updated Apr 6, 2026
Search Tags:#template#png#infographic#card-design#visual-content#sketchnote
One-click install
npx skills add https://github.com/fantay0312/fantayspec --skill py-card
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: py-card
Source: https://github.com/fantay0312/fantayspec/tree/main/shared/skills/skills-all/py-card
Command: npx skills add https://github.com/fantay0312/fantayspec --skill py-card

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires playwright, and includes assets (resource) components.

What problem does it solve?

py-card transforms content into PNG visuals, enabling rapid creation of shareable, visually structured cards from text, URLs, or files.

Core Features & Use Cases

  • Six molds exist for turning content into PNG cards: -l (default) long reading card, -i infograph, -m multi-card reading cards (1080x1440), -v visual sketchnote, -c manga-style comic, -w whiteboard (marker-style board layout). Output is saved to ~/Downloads. Use cases include digesting articles, notes, tutorials, or marketing visuals by turning content into shareable cards.
  • The system uses Markdown frontmatter to drive discovery and templates in assets to render visuals, with optional references, assets, and scripts as needed.
  • It supports invocation by phrases such as 铸, cast, 做成图, 做成卡片, 做成信息图, 做成海报, 视觉笔记, sketchnote, 漫画, comic, manga, 白板, or whiteboard.

Quick Start

Provide your content and run the tool to generate a PNG card using the default long mold.

Frequently Asked Questions about py-card

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I convert text content into a PNG infographic?▼

To convert text content into a PNG infographic, provide your text and trigger the rendering pipeline using the infograph mold. It applies local HTML templates and CSS styling to generate a structured PNG card saved to your downloads.

Does Playwright need to be installed to generate PNG cards?▼

Playwright is required to generate PNG cards because it powers the capture script within the rendering pipeline. The system relies on this dependency to render local HTML templates and capture consistent visual outputs.

What is the best way to make a visual sketchnote from an article?▼

The best way to make a visual sketchnote from an article is to use the visual sketchnote mold. It processes your article content through a molds-based rendering pipeline to produce marker-style board layouts as PNG outputs.

Can I generate multiple reading cards from a single URL?▼

You can generate multiple reading cards from a single URL by invoking the multi-card mold. It formats your content into 1080x1440 sized PNG layouts, enabling flexible visual storytelling across several structured cards.

What types of card designs are supported for visual content?▼

Card designs supported for visual content include long reading, infograph, multi-card, visual sketchnote, manga-style comic, and whiteboard layouts. These formats enable flexible visual storytelling from text or files.

Why are my PNG card outputs not working correctly?▼

PNG card outputs may not work correctly if the Playwright dependency is missing or local HTML templates in assets are modified. The rendering pipeline requires these components to function properly and capture consistent visuals.

Related Skills

Explore More Design & Creative Skills→
JackweiStudJackweiStud

x-article-publisher

Publish Markdown articles to X Articles with cover images and rich text.

Community
Advanced
dososodososo
138

blcaptain-style-skill

Generate social media cards and covers from text using Python templates.

Community
Intermediate
ddttomddttom

create-blog

Convert Markdown blog drafts into semantic, WCAG 2.1 AA compliant HTML with extracted SVGs and metadata.

Community
Advanced
zhengfranzhengfran

ljg-card

Render user-provided content into PNG visuals using selectable layout molds.

Community
Intermediate