blog-chart
SolidGenerate dark-mode-compatible inline SVG data visualization charts for blog posts. Supports horizontal bar, grouped bar, donut, line, lollipop, area, and radar charts with automatic platform detection (HTML vs JSX/MDX). Enforces chart type diversity, accessible markup (role=img, aria-label), source attribution, and transparent backgrounds. Use whenever the user mentions data visualization, charts, graphs, comparison tables that need to be visualized, or wants to embed inline SVG visualizations in a blog post, even if not invoking blog-write. Use when user says "blog chart", "generate chart", "data visualization", "svg chart", "blog graph", "visualize data", or when the blog-write workflow identifies chart-worthy data points (3+ comparable metrics, trends, before/after data).
Install
Quality Score: 96/100
Skill Content
Details
- Author
- AgriciDaniel
- Repository
- AgriciDaniel/claude-blog
- Created
- 3 months ago
- Last Updated
- 3 days ago
- Language
- Python
- License
- MIT
Integrates with
Similar Skills
Semantically similar based on skill content — not just same category
blog-figure-svg
Stop using stock photos. Generate accessible, lightweight SVG figures for any blog or CMS - flow diagrams, comparison bar charts, taxonomy/Venn diagrams, annotated terminal mocks, and 1600x840 OG feature cards. Hand-authored SVG (no embedded fonts, no external assets, no AI-image latency) with a consistent palette, screen-reader metadata (title + desc + aria-labelledby), and a figcaption-required handoff to the writer. Rasterizes to compressed PNG ready for Ghost, WordPress, Webflow, or any static-site generator. Built for content marketers, indie hackers, and dev-tool blogs that want unique illustrations on every post without paying a designer or burning Midjourney credits. Trigger when the user says: 'add a figure to the post', 'illustrate this comparison', 'draw a flow diagram for X', 'make a feature/OG image', or any request to produce a chart/diagram for editorial use.
chart-generator
Generate charts and visualizations from data using various charting libraries and formats.
obsidian-charts
Build interactive charts in Obsidian notes using the Charts plugin (phibr0/obsidian-charts). Renders Chart.js bar/line/pie/doughnut/radar/polarArea via `chart` codeblocks, can pull data straight from a markdown table by block ID (cross-file supported), and can render from a Dataview query via `window.renderChart`. Use when the user wants to chart, plot, graph, or visualize data sitting in their Obsidian notes — including tables, frontmatter values, Dataview/Dataviewjs results, or hand-written series — or mentions "obsidian charts", "chart codeblock", "renderChart", or "chart from table".
swift-charts
Implement, review, or improve data visualizations using Swift Charts. Use when building bar, line, area, point, pie, or donut charts; when adding chart selection, scrolling, or annotations; when plotting functions with vectorized BarPlot, LinePlot, AreaPlot, or PointPlot; when customizing axes, scales, legends, or foregroundStyle grouping; or when creating specialized visualizations like heat maps, Gantt charts, stacked/grouped bars, sparklines, or threshold lines.
data-visualizer
Create effective data visualizations with the right chart types, color palettes, and interactive features. Based on Anthropic's Claude Cookbooks (vision capabilities).