resume-hypergraph
Turn your resume into an interactive web page that shows where you used each skill.
Live example: varunmoka.com, the site this tool grew out of.
More examples (made-up people): https://resume-hypergraph.vercel.app
Why
A resume lists your skills in one place and your jobs in another. It does not show which skill
you used where. This page does. You sit in the centre, your jobs, studies and projects sit
around you, and every skill is connected to the places you used it.
For job seekers
- Shows proof for every skill. Each skill links to the jobs, studies and projects where you
used it, with one sentence on what you did there.
- One link to share. You get a single web page to put on your own site and link from your
CV, LinkedIn profile or applications.
- Says only what your resume says. Nothing is invented, and a number that is not in your
resume stops the page from being built.
- Keeps private details out. Phone number, home address and date of birth are left off the
page.
- Free. Open source, no account, no subscription.
For the person reading your page
A recruiter or hiring manager who opens your link can:
- Click a skill to see every place you used it and what you did there, without searching
your whole resume.
- Click an employer or school to see what the organisation does, your role and dates, and
the work you did.
- Opens in a web browser. Nothing to install. On a phone the same content is shown as a
simple list.
Quick start
You need an AI coding assistant. The steps below are for
Claude Code. Other tools are listed further down.
-
Install the plugin. Inside Claude Code, run:
/plugin marketplace add varunmoka7/resume-hypergraph
/plugin install resume-graph@resume-hypergraph
-
Open the folder that holds your resume (PDF, Word or text).
-
Say: "turn my resume into a graph"
It asks no questions. A resume takes about 3 to 5 minutes. When it finishes, the page opens in
your browser and you have a new folder, resume-graph/, with two files:
| File | What it is |
|---|
index.html | Your page. It opens straight from the file. |
profile.json | The data behind the page. Edit it, or ask the assistant to, and rebuild. |
-
To get a link you can share, say: "put it online"
It publishes the page as a Claude artifact, or on GitHub Pages if you are logged in to
GitHub's gh tool. Only the page goes online, never your resume file.
To name the file yourself: /resume-graph:resume-graph my-cv.pdf
Other tools
Only the routes marked "Yes" have been run so far. The others are written down as they should
work and have not been tried.
| Tool | How to install | Tried |
|---|
| Codex | Clone this repo, open it in Codex and say "turn my resume at ~/cv.pdf into a graph". AGENTS.md tells it what to do. | Yes |
| Cursor and others | Same as Codex: clone, open, ask. | No |
| Claude on the web | Download resume-graph.zip and upload it under Settings, Capabilities, Skills. Then share your resume in a chat and ask for a graph. Logos are left out there, because the Claude app cannot reach company websites. | Yes |
| Gemini CLI | gemini extensions install https://github.com/varunmoka7/resume-hypergraph | No |
| Tools with a skills folder | sh scripts/pack-skill.sh, then copy dist/resume-graph into the folder (~/.codex/skills/ for Codex, ~/.agents/skills/ is common). | No |
| No AI tool | Write profile.json by hand (format: skills/resume-graph/PROFILE-FORMAT.md) and run node scripts/profile.mjs build my-profile.json index.html | Yes |
How it works
- Read. Reads the resume and sorts every entry into a group: work, education, projects,
awards and so on.
- Research. Looks up each employer and school on the web and writes a one-line description
with a link to its source.
- Logos. Fetches each organisation's logo from its own website.
- Skills. Picks the skills and writes one sentence for each place a skill was used.
- Check. A script validates the data, and a second assistant that has not seen the drafts
checks every sentence against the resume.
- Build. Writes one HTML file and opens it.
What it will not do
- Invent. Sentences about you come from your resume. The build fails if one of them
contains a number your resume does not.
- Publish private details. Phone, street address, date of birth, marital status and
references are left out. Profile links printed on the resume, such as LinkedIn or GitHub, are
kept. Your email address is added only if you say yes.
- Guess about organisations. If it cannot find an employer or school, it leaves the
description out.
- Upload anything unasked. It builds a file on your computer. It goes online only when
you say "put it online".
Privacy
There is no server behind this tool, and it keeps nothing. Your resume is read by the AI
assistant you run it in, under that assistant's own terms. The files it writes (profile.json,
index.html and a text copy of your resume) stay in your own folder.
The tool contacts other sites only for these lookups:
- a web search for each organisation named on your resume, and a visit to its website
- a request to Google's favicon service when a site has no logo of its own
- one request to each web address shown on your page, such as your LinkedIn or GitHub link, to
check that it still opens
Security
To report a security problem, use "Report a vulnerability" on this repository's Security tab,
or open an issue if it is not sensitive.
The page
- One HTML file: plain HTML, CSS and JavaScript, no frameworks, no build step.
- Fonts are embedded, so the page loads nothing from other sites.
- Works on any static host, or inside an existing page through an
<iframe>.
- Long sections fold into a "+ N more" row.
- A small "Made with resume-hypergraph" link sits in one corner. Set
"credit": false in
profile.json to remove it.
Commands
In Claude Code every step is also available on its own, for redoing part of a graph.
| Command | Step |
|---|
/resume-graph:resume-graph | All six steps |
/resume-graph:read | Read the resume, sort entries into groups |
/resume-graph:company | Research one organisation and write that entry's panel |
/resume-graph:skills | Choose the skills and write one sentence per place used |
/resume-graph:check | Check every sentence against the resume |
/resume-graph:publish | Build the page, and put it online when asked |
Development
Requires Node.js. It was written and tested on Node 26; older versions have not been tried.
There are no dependencies to install.
python3 scripts/serve.py 8131 # preview at http://localhost:8131/view/
node --test scripts/ # tests for the check and the build
?p=short and ?p=long load the other sample profiles. All sample people and companies are
made up.
| Path | What |
|---|
view/ | The page: index.html, graph.js, style.css, fonts.css, sample data |
skills/ | The skill and its steps |
agents/ | The two agents the skill starts: one profiles an entry, one checks the result |
AGENTS.md | Instructions for Codex, Gemini CLI and other agents |
examples/ | A made-up resume to try it on |
scripts/profile.mjs | Checks a data file and builds the one-file page |
scripts/profile.test.mjs | Tests for the check and the build |
scripts/check-layout.py | Loads every sample at four screen sizes, fails on overlapping labels |
research/ | Notes on resume sections across professions and on existing resume formats |
docs/ | The picture used in this README and in link previews |
Status
Early release. What has been run so far:
- Claude Code: the two install commands above were run against GitHub, and the plugin was
run from start to finish, twice, on the made-up resume in
examples/. It was also run on two
made-up PDF resumes: a two-column engineer's CV and a two-page nurse's resume. Each took 3 to
5 minutes.
- Put it online: run in Claude Code, where it published the page as a private artifact. The
GitHub Pages commands were run by hand on a made-up page and the page came up.
- Codex: run from a clone of this repo on the same resume.
- Claude on the web: the zip was uploaded as a skill and run on a real one-page PDF resume. It
built the page without logos, and Claude showed it as an artifact.
- The page: checked in Chrome at four screen sizes, from phone to desktop.
- The scripts: on Node 26, on macOS.
Not tried yet: Word files, Gemini CLI, Cursor, copying the skill into a skills folder,
other browsers, other Node versions, Windows and Linux.
Issues and pull requests are welcome. If the tool trips on your resume, describe the section
that broke and leave private details out of the report.
License
MIT. The fonts are IBM Plex, under the SIL Open Font License (view/OFL.txt). Logos in a
built page belong to their organisations.
