graphics-designer

Convert HTML brand templates into PNG graphics via headless Chrome.

24|8|Updated May 3, 2026

Search Tags:#branding #templates #graphics #rendering #notion #drive #headless-chrome

Ready to run

npx skills add https://github.com/timscheuerai/content-vault --skill graphics-designer

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: graphics-designer
Source: https://github.com/timscheuerai/content-vault/tree/main/skills/graphics-designer
Command: npx skills add https://github.com/timscheuerai/content-vault --skill graphics-designer

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designers often struggle with manually turning HTML templates into polished, on-brand graphics. This skill automates the production of single images or multi-slide carousels from HTML templates, ensuring consistency with brand tokens and efficient delivery.

Core Features & Use Cases

Branch from existing templates or start fresh from brand tokens, render 1× and @2× PNGs via headless Chrome, and mirror outputs to Drive.
Output is logged to the Notion Content database for traceability; supports LinkedIn banners, portraits, and carousel formats.

Quick Start

Provide a design brief (format, channel, and brand constraints), and the skill will branch templates, render the final PNG, and log the result.

Frequently Asked Questions about graphics-designer

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

FAQPage Schema

How do I convert HTML templates to PNG graphics for LinkedIn banners and carousels?▼

To convert HTML templates to PNG graphics, you provide a design brief with format, channel, and brand constraints. The skill renders single images or multi-slide carousels via headless Chrome, outputting 1× and 2× PNGs.

Can I render multi-slide carousels from HTML using headless Chrome?▼

Yes, you can render multi-slide carousels from HTML using headless Chrome. The skill processes HTML-based brand templates and outputs publish-ready single or multi-slide PNG graphics.

Do I need Notion and Drive to automate HTML to PNG rendering?▼

Notion and Drive are not required to render PNGs, but they are used for logging and storage. Rendered graphics are mirrored to Drive, and processing results are logged to the Notion Content database for traceability.

What is the best way to generate on-brand graphics from HTML templates?▼

The best way to generate on-brand graphics from HTML templates is to start from brand tokens or existing templates. This ensures visual consistency across LinkedIn portraits, banners, and carousels before rendering to PNG.

Does HTML to PNG rendering support 2x resolution outputs?▼

Yes, HTML to PNG rendering supports both 1× and 2× resolution outputs. This ensures your publish-ready graphics meet high-resolution display requirements across various platforms and devices.

Why use brand tokens when converting HTML to PNG graphics?▼

Using brand tokens when converting HTML to PNG graphics ensures strict adherence to brand guidelines. It allows you to branch from existing templates or start fresh, guaranteeing visual consistency across all rendered outputs.