skills.rest
sogadaiki
sogadaikiCOMMUNITY
Explore all skills by this author →
GitHub

generate-thumbnail

Generate article thumbnail images by analyzing input text or file content.

Updated Mar 12, 2026
Search Tags:#image generation#Playwright#content creation#Gemini#AI design#thumbnail
One-click install
npx skills add https://github.com/sogadaiki/claude-code-skills --skill generate-thumbnail
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: generate-thumbnail
Source: https://github.com/sogadaiki/claude-code-skills/tree/main/skills/generate-thumbnail
Command: npx skills add https://github.com/sogadaiki/claude-code-skills --skill generate-thumbnail

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill automates the creation of professional-looking thumbnails for articles and content, ensuring your visuals are engaging and accurately represent your message.

Core Features & Use Cases

  • AI-Powered Design: Analyzes content to determine the optimal visual concept, message, and target audience.
  • Multi-Pass Generation: Iteratively refines the thumbnail through material gathering, design critique, AI generation, and quality checks.
  • Use Case: You've written a blog post about "The Future of AI in Healthcare." This Skill will analyze the post and generate a striking thumbnail that visually communicates the core message to healthcare professionals.

Quick Start

Generate a thumbnail for the article located at /path/to/your/article.md.

Frequently Asked Questions about generate-thumbnail

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

FAQPage Schema
How do I generate a thumbnail from an article file?▼

To generate a thumbnail from an article file, the Skill analyzes input text or file content to determine the optimal visual concept, message, and target audience. It then creates the thumbnail using AI background generation and HTML text overlays.

How does AI image generation create readable text overlays?▼

AI image generation creates readable text overlays by using Playwright to screenshot HTML text layered over backgrounds generated by Gemini 3.1 Flash Image. This process includes self-critique and quality gates to ensure text readability and visual appeal.

Do I need Playwright installed to automate thumbnail creation?▼

Yes, you need Playwright installed to automate thumbnail creation. It is a required dependency used for screenshotting overlaid HTML text during the final image rendering phase.

What is the best way to automate article thumbnail creation for content?▼

The best way to automate article thumbnail creation is using a multi-pass approach that analyzes input text for target audience, iteratively refines the design through self-critique, and applies quality gates for message clarity and visual appeal.

Can I use content analysis to target specific audiences with AI design?▼

Yes, you can use content analysis to target specific audiences with AI design. The Skill analyzes your input text or file content to determine the optimal visual concept, message, and target audience for your thumbnail.

Related Skills

Explore More Design & Creative Skills→
abdullah1854abdullah1854
1

seo-content-generation

Generate SEO-optimized articles from SERP analysis with meta tags and keyword placement.

Community
Intermediate
cdeistopenedcdeistopened
9

x-article-converter

Converts articles into X/Twitter threads with social handles and posting schedules.

Community
Intermediate
eddmanneddmann
2

playwright

Render dynamic web pages with Playwright to capture HTML, text, and screenshots.

Community
Intermediate
JackiexiaoJackiexiao

ai-image-generation

Generate AI images across 50+ models using the inference.sh CLI.

Community
Advanced