vm0-ai avatar

Htmlcsstoimage

Turns HTML and CSS into actual images via the hcti.io API. You can render custom HTML/CSS designs, screenshot live websites, or generate social media cards at specific dimensions. It handles Google Fonts, high DPI rendering, JavaScript-heavy pages with delays, and even blocks cookie banners automatically. The URLs it returns are permanent and CDN-backed, which is handy if you're generating og:image tags or need programmatic screenshots. Works well for turning code into visuals without spinning up a headless browser yourself. The selector option is clever for grabbing just one element from a page instead of the whole thing.

skills.sh installs
167
GitHub stars
76
last updated
Aug 21, 2026

Install

$ npx -y skills add vm0-ai/vm0-skills --skill htmlcsstoimage --agent claude-code

Installs into .claude/skills of the current project.

Files

Turns HTML and CSS into actual images via the hcti.io API. You can render custom HTML/CSS designs, screenshot live websites, or generate social media cards at specific dimensions. It handles Google Fonts, high DPI rendering, JavaScript-heavy pages with delays, and even blocks cookie banners automatically. The URLs it returns are permanent and CDN-backed, which is handy if you're generating og:image tags or need programmatic screenshots. Works well for turning code into visuals without spinning up a headless browser yourself. The selector option is clever for grabbing just one element from a page instead of the whole thing.

Browse the repository on GitHub

Sponsors

Details

Repository
github.com/vm0-ai/vm0-skills
Categories
Frontend Development, Backend & APIs
First seen
Jun 3, 2026

More from vm0-ai/vm0-skills

All 24
1nolly-studio avatarcomponents-buildnolly-studio/components-build-skillBuild modern, composable, and accessible React UI components following the components.build specification. Use when creating, reviewing, or refactoring componen166skills.sh installs
2rohitg00 avatarfile-watcherrohitg00/pro-workflowConfigure file watching hooks to auto-react to config changes, env file updates, and dependency modifications. Use to set up reactive workflows.165skills.sh installs
30xsardius avatarwagmi0xsardius/onchain-typescript-skillsReact hooks for Ethereum and EVM blockchain interactions using Wagmi v3. Use when building React or Next.js apps with wallet connections, contract reads/writes,163skills.sh installs
4community-access avataremail-accessibilitycommunity-access/accessibility-agentsAudits HTML email templates for accessibility under email client rendering constraints. Covers table-based layout, inline styling, image blocking fallbacks, sem162skills.sh installs
5jerrar670 avatarimplement_lenis_scrolljerrar670/surf-websiteInstructions for implementing Lenis smooth scrolling in a Next.js or React application.162skills.sh installs
6solar-luna avatarwechat-article-formattersolar-luna/fully-automatic-article-generation-skill将Markdown文章转换为美化的HTML格式,适配微信公众号发布。应用专业CSS样式、代码高亮、优化排版。当用户说"美化这篇文章"、"转换为HTML"、"优化公众号格式"、"生成公众号HTML"时使用。157skills.sh installs