New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Graphic Chart

by Varnan-Tech in Varnan-Tech/opendirectory

Generates data visualization charts (bar, line, area, pie, doughnut, scatter, radar, treemap) as PNG using Apache ECharts v6.

MITAuto-check passedData & Analytics

Install Graphic Chart

skills CLI
$ npx skills add Varnan-Tech/opendirectory --skill graphic-chart -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install Varnan-Tech/opendirectory graphic-chart --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/Varnan-Tech/opendirectory.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/graphic-chart .claude/skills/graphic-chart && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
graphic-chart
GitHub stars
674
Token cost
~2.9k tokens
SKILL.md length
936 words
Files
7 (incl. scripts, references)
Skills in repo
61
Repo updated
First seen
Licence
MIT

At a glance

Generates data visualization charts (bar, line, area, pie, doughnut, scatter, radar, treemap) as PNG using Apache ECharts v6.

  • Works in 6 steps: Intake → Internal Architecture (never shown to… → HTML Generation → …
  • User says create a chart
  • SKILL.md covers Critical Rules (read before…, Step 1: Intake, Step 2: Internal Architecture… and Step 3: HTML Generation, plus 4 more sections
  • Runs Shell and JavaScript scripts from its folder; calls bash; reaches cdn.jsdelivr.net

What it does

Graphic Chart is an agent skill from Varnan-Tech/opendirectory. Generates data visualization charts (bar, line, area, pie, doughnut, scatter, radar, treemap) as PNG using Apache ECharts v6. 1080×1080px default, 5 style presets, highlight annotations. Trigger when user says "create a chart", "visualize data", "make a bar chart", "line graph", "pie chart", "data visualization", "chart this data", "plot", "graph", or "visualize these numbers".

Its SKILL.md is about 2.9k tokens, which your agent loads only when the skill is triggered. The skill folder holds 9 other files, including scripts and reference files (for example `README.md`, `evals/evals.json` and `references/chart-library.md`). Compatibility notes: ["claude-code","gemini-cli","github-copilot"]

It sits in Data & Analytics, covering Data visualization. The repository describes itself as: AI Agent Skills built for Founders who hate Marketing. The licence is MIT.

When your agent uses it

  • User says create a chart
  • Make a bar chart
  • Data visualization
  • Chart this data

Example prompts

  • “create a chart”
  • “visualize data”
  • “make a bar chart”
  • “/graphic-chart”

Requirements

  • Node.js
  • A Bash shell
  • Compatibility (from SKILL.md): ["claude-code","gemini-cli","github-copilot"]

Workflow steps

6 steps, taken from the step headings in SKILL.md.

  1. Intake
  2. Internal Architecture (never shown to user)
  3. HTML Generation
  4. Self-QA (fix every failure before Step 5)
  5. Export
  6. Output Summary

What it can do on your machine

Read from SKILL.md and the folder at commit 62e437a. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships 2 files in scripts/ (Shell and JavaScript), which the agent can run.

    Shell commands in SKILL.md call:

    • bash

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    Hosts in commands or code, which the agent is likely to contact:

    • cdn.jsdelivr.net

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

  • Compatibility

    ["claude-code","gemini-cli","github-copilot"]

    From compatibility in the SKILL.md frontmatter.

Context cost

Graphic Chart loads about 2.9k tokens when it runs, and up to ~8k if it reads all its reference files. Until then it costs about 99 tokens; SKILL.md has 936 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~99
When it runs · the whole SKILL.md, loaded when a task matches
~2.9k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~8k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.

SKILL.md

The full file from Varnan-Tech/opendirectory at commit 62e437a, republished under its MIT licence (© Varnan-Tech). 936 words, ~2,928 tokens.

Download SKILL.mdSave it as .claude/skills/graphic-chart/SKILL.md (or your agent's skills folder). This skill also uses 6 other files; get the full folder from GitHub.
name
graphic-chart
description
Generates data visualization charts (bar, line, area, pie, doughnut, scatter, radar, treemap) as PNG using Apache ECharts v6. 1080×1080px default, 5 style presets, highlight annotations. Trigger when user says "create a chart", "visualize data", "make a bar chart", "line graph", "pie chart", "data visualization", "chart this data", "plot", "graph", or "visualize these numbers".
compatibility
["claude-code","gemini-cli","github-copilot"]
author
OpenDirectory
version
2.0.0

graphic-chart

Generates data visualization charts as PNG. Renders HTML with Apache ECharts v6 in headless Chromium via Playwright → screenshots at 2× retina quality.

CDN: https://cdn.jsdelivr.net/npm/echarts@6.0.0/dist/echarts.min.js

Critical Rules (read before every generation)

  1. area type → type: 'line' + areaStyle: {} — ECharts has no type: 'area'.
  2. doughnut → type: 'pie' + radius: ['40%', '70%'] — ECharts has no type: 'doughnut'.
  3. Readiness signal: register chart.on('finished', fn) BEFORE chart.setOption() — ECharts bug #14101/#17500: if listener is registered after setOption, it silently never fires. Always register both finished and rendered events before setOption.
  4. xAxis.type: 'category' must be explicit — ECharts does not infer it from the data. Forgetting this produces a blank chart.
  5. Category labels go in xAxis.data, not in a data.labels array. ECharts structure is flat: { xAxis, yAxis, series, grid, title, legend } — not nested under data or options.
  6. Data labels are fully built-in — use label: { show: true } on any series. No plugin needed.
  7. Highlight a specific bar/point via per-item itemStyle — put { value: N, itemStyle: { color: '#...' } } directly in the data array. Do NOT use Chart.js-style backgroundColor arrays.
  8. ECharts init uses a <div> container, not <canvas> — echarts.init(document.getElementById('chart')). The container div needs explicit dimensions.
  9. animation: false in option — disables animation for instant render. Still register finished + rendered events before setOption for the readiness signal.
  10. Never dump HTML in chat. Save to file, show summary only.
  11. Title states the insight, not the subject. "Revenue grew 3× in 12 months" not "Monthly Revenue".
  12. Pie/doughnut: use body padding: 64px 80px and .chart-container { max-height: 860px } — prevents edge-to-edge fill when no title.

Step 1: Intake

Required: chart_type, data

Optional parameters and defaults:

ParameterDefaultDescription
chart_type—bar / line / area / pie / doughnut / scatter / radar / treemap
data—JSON array or CSV — required
title—States the insight, ≤10 words
subtitle—1-sentence context line
styleclean-slateclean-slate / midnight-editorial / matt-gray / electric-burst / brutalist
dimensions1080x1080WxH pixels (output PNG = 2× via deviceScaleFactor)
x_label—X-axis label text
y_label—Y-axis label text
source—Data source shown in footer
highlight—Data label to highlight (e.g. "Q4", "Dec", index 3)

If chart_type or data is missing, ask exactly:

"To create the chart, I need:

  1. Chart type — bar / line / area / pie / doughnut / scatter / radar / treemap
  2. Data — provide as JSON array or CSV (e.g. [12, 18, 22, 25, 31] with labels ['Q1','Q2','Q3','Q4','Q5'])

Optional: title, style (default: clean-slate), dimensions (default: 1080×1080), highlight a specific data point"

If both present → skip to Step 2.

Step 2: Internal Architecture (never shown to user)

1. Normalize chart type:

  • area → line + areaStyle: {} on series
  • doughnut → pie + radius: ['40%', '70%'] on series
  • horizontal bar → bar + swap xAxis/yAxis (category axis on y)
  • All others: use as-is

2. Read references/chart-library.md — load full config spec for this chart type.

3. Read references/style-presets.md — load CSS tokens + data palette for chosen style.

4. Commit to design direction:

DecisionDerive from
ToneProfessional / editorial / bold / technical — match the data's audience
Data storySingle insight this chart proves (becomes the title)
Highlight strategyWhich data point needs visual emphasis and why?
BackgroundLight (clean-slate, matt-gray) or dark (midnight-editorial, electric-burst, brutalist)

5. Parse data:

  • Simple array [12, 18, 22] → series.data, labels provided separately
  • Object array [{x: 'Jan', y: 12}] → xAxis.data from x keys, series.data from y values
  • CSV: parse header row as xAxis.data, value row as series.data
  • Multi-series: multiple series entries each with type, name, data
  • Scatter: series.data: [[x1,y1], [x2,y2], ...] format

6. Parse dimensions: "1080x1080" → W=1080, H=1080. Body = WxH. Output PNG = 2W × 2H.

Show full SKILL.md (375 more words)Show less

Step 3: HTML Generation

Read ALL before generating:

  • references/chart-library.md for this chart type's full ECharts config spec
  • references/style-presets.md for the chosen style's CSS tokens + palette

Required HTML structure:

html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
[font CDN link from style preset]
<style>
:root {
  [all CSS tokens from style preset]
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html, body {
  width: [W]px; height: [H]px;
  overflow: hidden;
  background: var(--bg);
  font-family: var(--font-body);
}
body {
  display: flex;
  flex-direction: column;
  padding: 40px 48px 32px;   /* pie/doughnut: use 64px 80px */
}

/* ECharts container must have explicit size */
.chart-container {
  flex: 1;
  min-height: 0;
  /* pie/doughnut only: max-height: 860px; */
}

.chart-header { margin-bottom: 24px; }
.chart-title {
  font-family: var(--font-display);
  font-size: clamp(1.1rem, 2.5vw, 1.6rem);
  font-weight: 700;
  color: var(--text);
  line-height: 1.2;
}
.chart-subtitle {
  font-family: var(--font-body);
  font-size: clamp(0.75rem, 1.2vw, 0.9rem);
  color: var(--text-muted);
  margin-top: 6px;
  line-height: 1.5;
}
.chart-footer {
  margin-top: 14px;
  font-family: var(--font-body);
  font-size: 10px;
  color: var(--text-muted);
  opacity: 0.65;
}
</style>
</head>
<body>

[if title or subtitle: <div class="chart-header"><div class="chart-title">...</div>...</div>]

<div id="chart" class="chart-container"></div>

[if source: <div class="chart-footer">Source: [source]</div>]

<script src="https://cdn.jsdelivr.net/npm/echarts@6.0.0/dist/echarts.min.js"></script>

<script>
window.__chartReady = false;

document.fonts.ready.then(() => {
  const container = document.getElementById('chart');
  const chart = echarts.init(container, null, { renderer: 'canvas' });

  // CRITICAL: register events BEFORE setOption — ECharts bug #14101/#17500
  // 'finished' may silently not fire if registered after setOption with animation:false
  chart.on('finished', () => {
    window.__chartReady = true;
  });
  // Belt-and-suspenders fallback via 'rendered'
  chart.on('rendered', () => {
    clearTimeout(window.__renderDebounce);
    window.__renderDebounce = setTimeout(() => { window.__chartReady = true; }, 100);
  });

  const palette = [palette from style preset];

  const option = {
    animation: false,                            // instant render for screenshot

    backgroundColor: 'transparent',             // body CSS handles bg color

    textStyle: {
      fontFamily: '[--font-body value]',
      color: '[--text-muted value]',
    },

    [title config if title param provided],
    [legend config per chart type],
    [grid config per chart type],
    [xAxis config per chart type],
    [yAxis config per chart type],

    series: [{
      [full series config from chart-library.md for this type]
      [palette colors applied per chart type]
      [if highlight: per-item itemStyle on the highlighted data point]
    }]
  };

  chart.setOption(option);   // setOption ALWAYS comes after event registration
});
</script>
</body>
</html>

Design quality rules:

  • Title font: fontWeight: 'bold', fontSize: 20–24 — no thin titles
  • Grid lines: low opacity (0.06–0.10) — subordinate to data
  • Bars: barMaxWidth: 60, rounded via itemStyle.borderRadius: [4,4,0,0]
  • Lines: smooth: true for natural curves, symbolSize: 8 for points
  • Pie/doughnut: label.formatter: '{b}\n{d}%' for built-in on-slice labels
  • Dark presets: grid rgba(255,255,255,0.07), axis line/tick color rgba(255,255,255,0.15)
  • Tooltip: show: false — static PNG, no hover interaction
  • When no title provided: skip .chart-header, omit title from ECharts option

Step 4: Self-QA (fix every failure before Step 5)

Structure:

  • Container is a <div>, not <canvas>
  • window.__chartReady = false declared before document.fonts.ready
  • chart.on('finished', ...) registered BEFORE chart.setOption()
  • chart.on('rendered', ...) debounce fallback registered BEFORE chart.setOption()
  • animation: false in option object
  • chart.setOption(option) is the LAST call in the init block

Type-specific:

  • Area: type: 'line' + areaStyle: {} — no type: 'area'
  • Doughnut: type: 'pie' + radius: ['40%', '70%'] — no type: 'doughnut'
  • Bar: xAxis.type: 'category' explicitly set
  • Category data in xAxis.data (not data.labels)
  • Pie/doughnut: body padding: 64px 80px + .chart-container { max-height: 860px }
  • Highlight: per-item { value: N, itemStyle: { color } } in data array

Design:

  • All palette colors from references/style-presets.md
  • Title states insight (not just subject)
  • tooltip: { show: false } or omitted (no hover on static PNG)
  • Dark preset: grid/axis colors use rgba(255,255,255,...)
  • Source in footer if source param provided
  • Data labels visible (built-in label: { show: true } on series)

Step 5: Export

Determine slug from title or chart type + data context (kebab-case, ≤30 chars):

bash
mkdir -p chart/[slug]

Save HTML: chart/[slug]/chart.html

Quick browser check:

bash
open chart/[slug]/chart.html

Run export (replace [skill-root] with actual path to this skill's directory):

bash
bash [skill-root]/scripts/export-chart.sh \
  chart/[slug]/chart.html \
  chart/[slug]/chart.png \
  --width [W] \
  --height [H]

The script installs Playwright on first run (~200MB Chromium download), then captures the chart at deviceScaleFactor: 2.

Step 6: Output Summary

## Chart: [title]
Date: [YYYY-MM-DD] | Type: [chart_type] | Style: [style]
Dimensions: [W×H]px → PNG: [2W×2H]px @2× retina

Files
  Source:   chart/[slug]/chart.html
  Output:   chart/[slug]/chart.png
  Size:     [X] KB

Checklist
- [ ] Title states the insight clearly
- [ ] Data labels legible at display size
- [ ] Highlight visible on correct data point
- [ ] Source attribution present in footer

Prompt Tips (show when user asks for guidance)

"Provide structured data — JSON or CSV, not prose descriptions."

"Name the chart type explicitly. 'bar chart comparing Q1–Q4' not 'a chart showing quarters'."

"Specify the data story. 'highlight Q4 which outperformed all others' gives the annotation context."

✅ Good: "Create a line chart. Title: 'From $12k to $95k ARR in 12 Months'. Data: [12, 18, 22, 25, 31, 38, 44, 52, 61, 68, 78, 95] (Jan–Dec 2024). Highlight December. Source: Internal CRM. Style: electric-burst."

❌ Bad: "make a chart about our company growth"

© Varnan-Tech, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 6 other files (scripts, references) in skills/graphic-chart of Varnan-Tech/opendirectory.

  • SKILL.md
  • README.md
  • evals/evals.json
  • references/chart-library.md
  • references/style-presets.md
  • scripts/export-chart.sh
  • scripts/screenshot-chart.mjs

Open the folder on GitHubat commit 62e437a

Compare with similar skills

Graphic Chart next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Graphic Chart compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Graphic Chart this skillVarnan-Tech/opendirectory674—~2.9kAutomated safety check: PassMIT
MatplotlibzLanqing/codex-claude-academic-skills4.7k17 repos~2.9kAutomated safety check: PassMIT
Chart Visualizationbytedance/deer-flow84k2 repos~840Automated safety check: PassMIT
Scientific Visualizationmims-harvard/OptimusKG14619 repos~6.3kAutomated safety check: PassMIT
SeabornzLanqing/codex-claude-academic-skills4.7k15 repos~4.9kAutomated safety check: PassBSD-3-Clause
Plot From DataTrae1ounG/paper-plot-skills8691 repos~583Automated safety check: PassNone

Similar skills

  • Matplotlib

    zLanqing/codex-claude-academic-skills

    Low-level plotting library for full customization. An agent skill from zLanqing/codex-claude-academic-skills.

    4.7k GitHub starsUsed in 17 repos~2.9k tokens
    Data & AnalyticsAuto-check passed

  • Chart Visualization

    bytedance/deer-flow

    Picks a suitable chart type from 26 options for your data, maps the data to that chart's parameters and generates a chart image through a JavaScript script.

    84k GitHub starsUsed in 2 repos~840 tokens
    Data & AnalyticsAuto-check passed

  • Scientific Visualization

    mims-harvard/OptimusKG

    Create publication figures with matplotlib/seaborn/plotly. An agent skill from mims-harvard/OptimusKG.

    146 GitHub starsUsed in 19 repos~6.3k tokens
    Data & AnalyticsAuto-check passed

  • Seaborn

    zLanqing/codex-claude-academic-skills

    Statistical visualization with pandas integration. An agent skill from zLanqing/codex-claude-academic-skills.

    4.7k GitHub starsUsed in 15 repos~4.9k tokens
    Data & AnalyticsAuto-check passed

  • Plot From Data

    Trae1ounG/paper-plot-skills

    Generate publication-quality matplotlib figures by selecting a pre-built paper style and substituting user data.

    869 GitHub starsUsed in 1 repo~583 tokens
    Data & AnalyticsAuto-check passed

  • Scientific Figure Making

    ChenLiu-1996/figures4papers

    Covers publication-ready matplotlib figures for academic papers, slides, and reports—bars, trends, scatter, heatmaps, and multi-panel layouts—with this…

    8.3k GitHub stars~557 tokensUpdated 3 days ago
    Data & AnalyticsAuto-check passed

More from Varnan-Tech/opendirectory

All 61 skills in this repo

  • Graphic Ebook

    Varnan-Tech/opendirectory

    Creates professionally designed B2B SaaS e-books in HTML + CSS, exported as print-ready PDF.

    674 GitHub stars~5k tokensUpdated 1 mo ago
    Auto-check passed

  • Docs From Code

    Varnan-Tech/opendirectory

    Generates and updates README.md and API reference docs by reading your codebase's functions, routes, types, schemas, and architecture.

    674 GitHub stars~1.8k tokensUpdated 1 mo ago
    Auto-check passed

  • Graphic Gif

    Varnan-Tech/opendirectory

    Creates animated looping GIFs from CSS animations (default) or AI image-to-video.

    674 GitHub stars~3k tokensUpdated 1 mo ago
    Auto-check passed

  • Map Your Market

    Varnan-Tech/opendirectory

    Given a product description, category keywords, or competitor names (any combination), searches Reddit, Hacker News, GitHub Issues, G2, and Google Trends for the real pains your market experiences…

    674 GitHub stars~4.3k tokensUpdated 1 mo ago
    Auto-check passed

  • Newsletter Digest

    Varnan-Tech/opendirectory

    Aggregates RSS feeds from the past week, synthesizes the top stories using Gemini, and publishes a newsletter digest to Ghost CMS.

    674 GitHub stars~1.9k tokensUpdated 1 mo ago
    Auto-check passed

  • Podcast Transcript Fetcher

    Varnan-Tech/opendirectory

    A skill your agent uses when fetching, searching, or analyzing transcripts from Lenny's Podcast, Dwarkesh Podcast, Cheeky Pint, 20VC, or A16z Podcast.

    674 GitHub stars~1.9k tokensUpdated 1 mo ago
    Auto-check: notes

Categories

Questions about Graphic Chart

What does Graphic Chart do?

Generates data visualization charts (bar, line, area, pie, doughnut, scatter, radar, treemap) as PNG using Apache ECharts v6. Graphic Chart is an agent skill from Varnan-Tech/opendirectory. Generates data visualization charts (bar, line, area, pie, doughnut, scatter, radar, treemap) as PNG using Apache ECharts v6.

When should I use Graphic Chart?

Graphic Chart fits situations like: user says create a chart; make a bar chart; data visualization; chart this data.

How do I install Graphic Chart in Claude Code?

Run `npx skills add Varnan-Tech/opendirectory --skill graphic-chart -a claude-code`. Or copy the skill folder (skills/graphic-chart in Varnan-Tech/opendirectory) into .claude/skills/graphic-chart in your project. Claude Code loads it when a task matches its description.

How do I install Graphic Chart in Codex?

Run `npx skills add Varnan-Tech/opendirectory --skill graphic-chart -a codex`. Or copy the skill folder (skills/graphic-chart in Varnan-Tech/opendirectory) into .agents/skills/graphic-chart in your project. Codex loads it when a task matches its description.

Can I use Graphic Chart in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add Varnan-Tech/opendirectory --skill graphic-chart -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/graphic-chart, .gemini/skills/graphic-chart, .github/skills/graphic-chart and .opencode/skills/graphic-chart in your project.

What does Graphic Chart need to run?

Going by SKILL.md and its folder, Graphic Chart needs a shell and JavaScript for the scripts in its folder and the command-line tools its instructions call (bash). Our summary lists: Node.js; A Bash shell. Compatibility (from SKILL.md): ["claude-code","gemini-cli","github-copilot"].

Does Graphic Chart access the network?

SKILL.md names 1 domain. In commands or code: cdn.jsdelivr.net; the agent is likely to contact it when it follows the instructions. This is read from the text; nothing was executed.

Is Graphic Chart safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.

What licence does Graphic Chart use?

Graphic Chart is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Graphic Chart use?

About 2.9k tokens (SKILL.md is roughly 12k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 5.1k tokens, read only when the agent opens those files.

What are the alternatives to Graphic Chart?

Skills that share tags, products or a category with Graphic Chart: Matplotlib (zLanqing/codex-claude-academic-skills, 4.7k stars), Chart Visualization (bytedance/deer-flow, 84k stars), Scientific Visualization (mims-harvard/OptimusKG, 146 stars) and Seaborn (zLanqing/codex-claude-academic-skills, 4.7k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Graphic Chart?

Varnan-Tech (a GitHub organization) maintains it in Varnan-Tech/opendirectory, which has 674 GitHub stars. The repository holds 61 skills in this directory. The repository was last updated on August 16, 2026.

Source: Varnan-Tech/opendirectory on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.