skills.rest
Emasoft
EmasoftCOMMUNITY
Explore all skills by this author →
Website𝕏@fmuaddibGitHub

amw-infographics

Generates dense editorial infographics as HTML, PNG, and PDF from structured data briefs.

Updated Jul 8, 2026
Search Tags:#html#data visualization#playwright#tokenomics#infographic#editorial design#png export
One-click install
npx skills add https://github.com/Emasoft/ai-maestro-webdesign --skill amw-infographics-emasoft
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: amw-infographics
Source: https://github.com/Emasoft/ai-maestro-webdesign/tree/main/skills/amw-infographics
Command: npx skills add https://github.com/Emasoft/ai-maestro-webdesign --skill amw-infographics-emasoft

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve? Turning raw data briefs (tokenomics, roadmaps, ecosystem maps, stat summaries) into polished, shareable infographic posters normally requires a designer and multiple tools; this Skill produces dense editorial infographics directly as self-contained HTML plus retina PNG and print-ready PDF exports. ## Core Features & Use Cases - Three execution modes: Interactive Builder (component-by-component with live preview), One-Shot (full infographic in one pass), and Guided Creative (two composition options before building). - 24-template library and 175-design DNA rules: Pre-built templates for crypto/web3 and generic content, enforced by non-negotiable rules (no fabricated data, dark backgrounds, all-caps condensed display fonts, visible borders). - Multi-platform export: Seven canvas sizes (portrait, Twitter/X, Instagram, LinkedIn, Pinterest, website) exported via Playwright/Chromium to PNG at 2x scale and print-ready PDF. - Use Case: Given a token allocation and vesting schedule, produce a tokenomics poster with an SVG pie chart, CSS vesting bars, and a dense eligibility table, exported as PNG for Twitter and PDF for a whitepaper. ## Quick Start Ask the AI to create an infographic from your data brief, for example: turn these tokenomics stats into a dark editorial infographic for Twitter.

Frequently Asked Questions about amw-infographics

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

FAQPage Schema
How do I create an infographic from a data brief?▼

Provide your data (stats, allocations, schedules) and choose a mode: One-Shot builds the full infographic in one pass, Guided Creative offers two composition options first, and Interactive Builder assembles it component by component with live preview. The output is HTML plus PNG and PDF exports.

What chart types can I use in an HTML infographic?▼

Static allocation data uses pure CSS or inline SVG: pie charts, horizontal bars, waffle charts, slope charts, and progress bars. Chart.js via CDN is reserved for line charts, vertical bars, and radar charts that need dynamic rendering.

What image sizes does infographic export support?▼

Seven canvas sizes are supported: portrait-medium 1080x1440 (default), Twitter/X 1200x675, Instagram square 1080x1080, Instagram portrait 1080x1350, LinkedIn 1200x627, Pinterest 1000x1500, and website 1100xauto. Export runs through a Playwright script at 2x scale.

Why does my infographic look like a SaaS landing page?▼

That failure mode comes from uniform card grids, paragraph text, and invisible borders. The Anti-Frontend Checklist requires 3+ component types, bullet-only body text, visible borders at 0.25+ opacity, and density targets of 8+ content blocks on portrait canvases.

Can I use fabricated or placeholder stats in an infographic?▼

No. Fabricated data is a non-negotiable violation; every number must come from the user's input brief. Lorem ipsum, placeholder text, and emoji-as-icons are also banned and will fail the quality gate.

Related Skills

Explore More Design & Creative Skills→
SanctifiedOpsSanctifiedOps
3

token-distribution-planning

Design transparent SPL token distributions and vesting plans with allocation tables and custody strategies.

Community
Intermediate
jangtrinhjangtrinh

slides

Combine HTML slides into a 1080×1080 deck and export 2160×2160 PNGs.

Community
Advanced
mkatoguimkatogui
3

brand-identity-generator

Generate brand identity systems with CSS-ready tokens and brand guidelines.

Community
Advanced
roviczzzroviczzz
1

scroll-experience

Create scroll-driven animations and parallax storytelling for cinematic web pages.

Community
Advanced