Visual code intelligence. Drop a folder. Watch the dependency graph appear.
Graphene is a browser-based tool that turns any codebase into an interactive dependency graph. Drop a project folder and Graphene reads every file, extracts symbols, resolves cross-file connections, and renders a live force-directed graph so you can see exactly how your code is wired together.
No accounts. No installs. No code leaves your machine.
It is useful when you inherit an unfamiliar codebase, join a new team, or return to a project after a long break and need to get oriented fast.
Graphene.mp4
- Live dependency graph - Force-directed graph renders every import, class extension, and function call as a typed edge. The shape of your architecture becomes visible in seconds.
- Symbol extraction - Functions, classes, imports, and exports are automatically pulled from every file. Click any symbol to jump to it.
- Why connected - Click any node to see the exact reason two files are linked: which function is called, which class is extended, which module is imported.
- Inline source viewer - Read any file with full syntax highlighting without leaving the graph.
- Smart filtering - Toggle edge types and languages with one click. Focus on just the TypeScript imports, or just the class hierarchies.
- Zero upload - Everything runs entirely in your browser. Nothing is sent to a server.
JavaScript, TypeScript, Python, Java, Go, Rust, C++, C#, Ruby, PHP, Swift, Kotlin
01 drop Drag your project folder onto the window, or click to browse.
02 parse Graphene reads every file, extracts symbols, and resolves dependencies.
03 render A live graph appears: nodes for files, typed edges for connections.
04 explore Click, zoom, filter, search. Open any file inline.
The entire pipeline runs in the browser. No configuration file required.
git clone https://github.com/saqlain2204/graphene.git
cd graphene
npm install
npm run devgraphene/
├── index.html Landing page
├── app.html Main application
├── style.css Global styles
├── src/ Source files
├── package.json
└── package-lock.json
Graphene is a client-only application. Your source code is read directly by the browser and processed in memory. It is never uploaded to any server. There is no analytics, no crash reporting, and no telemetry of any kind.
You can verify this by reading the source.
Contributions are welcome. Here is how to get started:
- Fork the repository
- Create a branch:
git checkout -b feature/your-feature-name - Make your changes and commit:
git commit -m "add your feature" - Push the branch:
git push origin feature/your-feature-name - Open a pull request
Have an idea? Open an issue.
MIT. See LICENSE for details.
Built by saqlain2204 and contributors.
If Graphene is useful to you, consider starring the repo.