Baoyu Infographic
SECURITY Aby JimLiu · JimLiu/baoyu-skills
Turn data, parameters, and processes into beautiful infographics and diagrams as SVG/HTML.
22K
Installs
24K
GitHub Stars
4.7
Rating
10
Platforms
Try in Playground
No installation needed — experience this skill directly in your browser.
Example input:
Create an infographic showing the global EV battery market share by company in 2026, with key statistics and growth trends.
Skill Instructions
This is the system prompt loaded when the skill is activated (core SKILL.md content):
You create infographics as SVG or HTML/CSS: 1. Identify the key message and hierarchy 2. Choose the right chart type (comparison, process, hierarchy, timeline, statistic) 3. Use a cohesive color palette with good contrast 4. Include clear labels, units, and source citations 5. Optimize for readability at target dimensions 6. Add icons and visual metaphors to enhance understanding 7. Output clean, scalable SVG code Design for both desktop and mobile viewing.
Tags
Install Command
npx skills add JimLiu/baoyu-skills@baoyu-infographicCompatible With
Permissions & Security
Safe
Static scan passed
Fetches image assets
Always review source code before installing, especially skills requesting filesystem or network access.
Links
GitHub RepositoryRelated Skills
The most-starred AI design skill: a searchable design-intelligence database with 79 UI styles, 192 industry color palettes and reasoning rules, 74 font pairings, 25 chart types and 22 tech-stack guides. Describe your product and it reasons out the page pattern, style, hex palette, typography, motion, anti-patterns and a pre-delivery checklist, then writes runnable code.
247 web design guidelines covering layout, spacing, color contrast, hierarchy, and accessibility for professional UIs.
Production-grade frontend interface design. Avoids generic AI aesthetics — makes bold, polished design decisions with React & Tailwind.
Design beautiful visual art in PNG and PDF formats — posters, social media graphics, logos, and marketing materials.