An AI skill that provides design intelligence for building professional UI/UX across multiple platforms.
Skills
Html based image generation skills
Install: npx skills add https://github.com/html2png/skills --skill html-to-image
Works with Claude Code · 10 GitHub stars
Install
$
npx skills add https://github.com/html2png/skills --skill html-to-imageInstall command taken from the project's README or registry entry. Always review code before running it.
README excerpt
Read full README on GitHub →html2png Skills
AI skills for html2png.dev - helping AI agents generate images via HTML/CSS.
Skills Overview
| Skill | Purpose | Trigger Examples |
|---|---|---|
| html-to-image | Core API for any HTML-to-image conversion | "convert html to png", "generate image from html" |
| website-screenshot | Capture live websites by URL | "screenshot website", "capture webpage" |
| code-to-image | Syntax-highlighted code snippets | "code screenshot", "share code as image" |
| og-image | Social media preview cards | "og image", "twitter card", "social share image" |
Why These Skills Exist
AI is better at designing symmetric, crisp images with perfect typography using HTML/CSS than generating raster images directly. These skills help AI agents:
- Generate images with perfect text rendering
- Create pixel-precise geometric layouts
- Use any web font or icon library via CDN
- Apply modern CSS (gradients, shadows, glassmorphism)
Installation
Install each skill directly from this repo:
# html-to-image
npx skills add https://github.com/html2png/skills --skill html-to-image
# website-screenshot
npx skills add https://github.com/html2png/skills --skill website-screenshot
# code-to-image
npx skills add https://github.com/html2png/skills --skill code-to-image
# og-image
npx skills add https://github.com/html2png/skills --skill og-image
License
MIT
Similar plugs
The 1st Collaborative AI Design Agent Workspace. Local-first and open source. Create prototypes, websites, apps, dashboards, presentations, images, and videos with your team…
Agent skills that give coding agents taste: art direction, reference images and a browser check instead of generic AI pages
Turn any idea, plan, or codebase into a beautiful interactive diagram. An agent skill for Claude Code, Codex, and more.
Editorial diagram design for Claude Code, Codex, GitHub Copilot, Cursor, Factory Droid, and Pi. 44 diagram types. Self-contained HTML + SVG. No shadows. No Mermaid slop.
Clone any website with one command using AI coding agents