Skip to content

Guide · Agent skill

How to use the ljg-card skill to turn text into a PNG

Updated · written with AI from the project's own documentation and checked against our catalogue data

ljg-card is an agent skill that takes text you give it (an article, notes, or pasted content) and renders it as a PNG image using HTML typography. It is useful for writers and teachers who want a shareable image version of an explanation. After this guide you will know how to install the skill, how to ask for one of its four layouts, what it needs on your machine, and where its limits are.

ljg-card content casterlijigang/ljg-skills · MIT

Quick start

  1. 1Download and unzip. Download the ljg-card ZIP from this page and unzip it into ~/.claude/skills/ or a project's .claude/skills/ folder.
  2. 2Or upload it in the Claude apps. In the Claude apps, open Settings → Capabilities → Skills and upload the skill.
  3. 3Install Bun and Chromium. Run bun install and bunx playwright install chromium from the skill folder if they are not already set up.
  4. 4Make your request. Ask in plain language using a trigger word such as 做成卡片 or 漫画, and add -l, -f, -c or -w to choose the layout.
  5. 5Provide the source. Paste the text, give a URL, or give a local file path. The agent checks title, author and source before it lays out the card.
  6. 6Review the PNG. Check the returned file path and the visual QA report, then open the PNG to confirm the layout reads well.

What the ljg-card skill makes the agent do

The skill turns input text into a PNG. Text, numbers, labels and sources are laid out with HTML and CSS. When a layout calls for it, the skill can also request generated raster illustrations from the host environment's image generation tool.

There are four layouts, selected with a flag. -l is the default long reading card. -f is a source-faithful full-text card that keeps the original wording unchanged and generates no new images. -c is a comic layout. -w is a whiteboard-style vertical argument. All layouts are 1080 pixels wide, with height set by the content.

  • -l (default): long reading card, 0 to 3 illustrations
  • -f: full original text, no generated images, only images already in the source
  • -c: comic storyboard, panel count set by the content
  • -w: whiteboard argument diagram with 0 to 4 illustrations

Install the ljg-card skill for Claude

Download the ljg-card ZIP from the skill page on this site. Then choose one of two routes.

For Claude Code, unzip the folder into ~/.claude/skills/ for all your projects, or into a project's .claude/skills/ folder for that project only. For the Claude apps, upload the skill under Settings → Capabilities → Skills.

  • Personal install: ~/.claude/skills/
  • Project install: .claude/skills/ inside your project
  • Claude apps: Settings → Capabilities → Skills

Install the dependencies the skill needs

The skill runs scripts and takes screenshots, so it needs a JavaScript runtime and a headless browser. Run these commands from the skill's folder if the dependencies are missing.

The local font KingHwa_OldSong is optional. If it is not installed, the skill falls back to system serif fonts such as Songti SC, STSong, Noto Serif CJK SC or a generic serif. The skill does not download or install fonts for you.

  • Bun runtime is required
  • Playwright with Chromium is required for the screenshot step
  • KingHwa_OldSong is optional; without it, system fonts are used
  • An image generation tool in the host environment is needed only for illustrated layouts (-l, -c, -w)
bun install bunx playwright install chromium

Trigger the skill with a natural request

You do not need to type a command. Ask in plain language and include one of the trigger words from the skill description: 铸, cast, 做成图, 做成卡片, 做成海报, 原文排版, 全文卡片, 漫画 or 白板. Add a flag such as -f or -c if you want a specific layout. Without a flag, the agent uses -l.

Give the agent the source as a URL, pasted text, or a local file path. The skill reads URLs with the web-reading tool available to the agent, reads local files directly, and uses pasted text as-is without adding facts.

  • "把这篇论文做成卡片 -l" for a long reading card
  • "这篇文稿用 -f 铸成全文卡片,原文不要动" for an unchanged full-text image
  • "把这篇技术解释做成漫画 -c" for a comic
  • "把这份笔记做成白板 -w" for a whiteboard argument

Check the output and what to expect

The skill asks the agent to report the PNG's absolute path, pixel size, content source, layout used, number of generated images, and visual QA results. For -f it also reports the count of ordered text blocks and the full-text check result, and the generated image count is always 0.

The skill keeps intermediate files in a temporary folder under /tmp and asks for a clean-up after delivery. Only the final PNG should be kept. The skill's instructions also refer to reference files in a references/ folder; make sure those are present in your download before relying on the layouts.

  • Final PNG is reported with its full path and 1080px width
  • -f output has no generated images
  • Intermediate candidates are not delivered

What people use it for

  • Turn a long article or essay into a shareable 1080px reading card for social media or a newsletter
  • Render an unchanged full-text version of a document as a long image with -f
  • Explain a technical concept as a comic strip where a minimal example is run and re-run across panels with -c
  • Build a whiteboard-style argument diagram from notes or a teaching script with -w
  • Make a poster-style image from pasted text using the 做成海报 trigger

Frequently asked questions

How do I install the ljg-card skill?

Download the ZIP from this page and unzip it into ~/.claude/skills/ for personal use or into a project's .claude/skills/ folder. In the Claude apps, you can instead upload it under Settings → Capabilities → Skills.

What do I need to run ljg-card?

You need the Bun runtime and Playwright with Chromium, installed with bunx playwright install chromium. The KingHwa_OldSong font is optional, and an image generation tool in the host environment is needed only for illustrated layouts.

Is ljg-card free to use?

The skill is released under the MIT licence, as stated on this page. Check the licence file in the repository for the full terms.

What is the difference between -l and -f?

-l is the default long reading card, which can include up to three illustrations and reshapes the content for explanation. -f keeps the source text unchanged, uses only the original text and any images already in it, and generates no new images.

Can ljg-card run without an image generator?

Yes for the -f layout, which generates no images. For -l, -c and -w, the image count can be zero, but the skill expects an image tool to exist if an illustration is needed.

Why does the skill need network access and scripts?

It runs scripts to lay out the page and take the screenshot, and it can read URLs and fetch content. Do not use it on confidential source text if your workflow fetches web pages or fonts, or sends content through an image generation tool.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Use ljg-card if you want a PNG version of an article, notes, or an unchanged full text, and you can install Bun and Chromium. Pick a different tool if you need a text summary or an editable document file, since this skill only outputs images, or if your source text is confidential and must not pass through web fetching or an image generator.

Download the skill