# highlight-graph

Turns your Readwise highlights into an interactive graph so you can see which ideas from different books and articles connect.

- skill · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 443 installs · ★ 325
- Author: readwiseio
- License: not stated · policy=link-only · description only; the file stays with the author
- Source: https://github.com/readwiseio/readwise-skills/tree/HEAD/skills/highlight-graph/SKILL.md
- Updated: 2026-06-19
- HTML: https://affpapa.org/en/nevibecode/skills/highlight-graph

## What it does

The skill pulls your recent highlights through the Readwise MCP tools, or through the `readwise` CLI when MCP is not connected. It groups them by source, then launches several parallel subagents to look for conceptual links between highlights from different books. The result is a single HTML file built on force-graph that opens in a browser with no server.

It renders the graph without edges first so you have something to look at, then adds the connections. The `build_graph.py` script does the heavy lifting: deduplication, one colour per source, full pairwise links inside each book, and dashed edges across sources. A sidebar lists connected ideas and same-book highlights, and the legend filters by source.

You need either the Readwise MCP server or the `readwise` binary in PATH — the skill checks for this first. Python 3 is required to run the build script. The API returns `book_id` but not the title or author alongside each highlight, so the skill infers both from the text and available metadata; when it cannot tell, the author may end up as "Unknown". Worth a look at the labels if you read several sources with similar names.

## Install

### Claude Code (native platform)

1. **Skills CLI (Vercel)**
```bash
npx skills add readwiseio/readwise-skills --skill highlight-graph -a claude-code
```

2. **Manually: put the files in place**
- File: `~/.claude/skills/highlight-graph/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/highlight-graph/

### Codex

1. **Skills CLI (Vercel)**
```bash
npx skills add readwiseio/readwise-skills --skill highlight-graph -a codex
```

2. **Manually: put the files in place**
- File: `.agents/skills/highlight-graph/SKILL.md` — For all projects use ~/.agents/skills/

### Cursor

1. **Skills CLI (Vercel)**
```bash
npx skills add readwiseio/readwise-skills --skill highlight-graph -a cursor
```

2. **Manually: put the files in place**
- File: `.cursor/skills/highlight-graph/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install readwiseio/readwise-skills highlight-graph
```

2. **Manually: put the files in place**
- File: `.github/skills/highlight-graph/SKILL.md`

### Gemini CLI

1. **Skills CLI (Vercel)**
```bash
npx skills add readwiseio/readwise-skills --skill highlight-graph -a gemini-cli
```

2. **Platform CLI**
```bash
gemini skills install https://github.com/readwiseio/readwise-skills --path skills/highlight-graph
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/highlight-graph/SKILL.md` — The legacy .windsurf/skills/ path still works

### OpenCode

**Skills CLI (Vercel)**
```bash
npx skills add readwiseio/readwise-skills --skill highlight-graph -a opencode
```

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/readwiseio/readwise-skills/tree/HEAD/skills/highlight-graph/SKILL.md

## When to use it
- see which ideas from different books overlap
- pull all recent Readwise highlights into one view
- filter the graph down to a single source
- find conceptual links between notes by hand
- get a self-contained HTML graph with no server

## Example prompts
- build a graph from my latest Readwise highlights
- fetch more pages of highlights and rebuild the graph
- keep only the highlights from this book in the graph

## Similar
- [graph-viewer](https://affpapa.org/en/nevibecode/skills/graph-viewer.md) — skill · 1900 installs
- [node-link-and-diagram-layout](https://affpapa.org/en/nevibecode/skills/node-link-and-diagram-layout.md) — skill · 16 installs
- [graph-colorize](https://affpapa.org/en/nevibecode/skills/graph-colorize.md) — skill · 2800 installs
- [security-ownership-map](https://affpapa.org/en/nevibecode/skills/security-ownership-map.md) — skill · 3800 installs
- [langgraph](https://affpapa.org/en/nevibecode/skills/sickn33-langgraph.md) — skill · 1300 installs
- [react-flow](https://affpapa.org/en/nevibecode/skills/framara-react-flow.md) — skill · 821 installs

From the same set: [readwiseio/readwise-skills](https://affpapa.org/en/nevibecode/by/readwiseio/readwise-skills.md) — 7 cards

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md