SPDX 3 SBOM Visualizer

A browser-based tool for exploring SPDX 3 SBOMs (Software Bill of Materials). Drop one or more JSON-LD files and navigate the relationships between packages, files, tools, builds, agents, etc. as an interactive graph.

Features

• Load SPDX 3 files from your computer, or start with one of the bundled samples.
• Combine several SBOM files into one model, with cross-document references resolved automatically.
• Search across the SBOM, browse dedicated views for each kind of element, inspect the raw JSON-LD, or explore relationships as an interactive graph.
• Follow dependencies, provenance, and blast radius in the Impact view. Use graph filters and heatmaps to focus on vulnerabilities or functional-safety gaps.
• Dig into software, files, licenses, builds, agents, hardware, AI datasets and models, security and VEX data, and functional-safety requirements when those profiles are present.
• Trace requirements down to source snippets, inspect SBOM completeness statistics, and share links to exact views of the bundled samples.
• Keep the SBOM itself in your browser. Files loaded from your computer are parsed locally and are never uploaded.

See CHANGELOG.md for release history.

Usage

Open the hosted visualizer, then drop one or more .json or .jsonld files onto the page. You can also use the file picker or open a bundled sample. Adding several files is useful when an SBOM is split across source, build, and output documents.

Everything needed to parse and explore your SBOM runs in the browser. The app only makes external requests when you choose a bundled sample or when it looks up optional public metadata, such as SPDX license text or a CVE record.

Run locally

Development and CI use Node.js 22. The repository also uses Git LFS for one of the larger sample files (why yes, the tool can ingest hundreds of megabytes worth of SBOMs just fine!), so pull the LFS objects after cloning if you want all bundled samples.

git lfs pull
npm ci
npm run dev

Vite prints the local URL, normally http://localhost:5173. Changes to JavaScript, CSS, and view partials are reflected automatically.

To check the production build locally:

npm run build
npm run preview

The build is written to dist/. It is a static site with relative asset paths, so it can be published below a URL prefix or served directly with any static file server. Files under public/, including the sample SBOMs, are copied into the build unchanged.

Development

Run the same checks as CI with:

npm run format:check
npm run lint
npm run typecheck
npm test
npm run build

npm run format applies Prettier when you want it to fix formatting instead of only checking it.

Layout

• index.html: thin shell that <include>s the view partials
• src/views/: one HTML partial per view (packages, files, graph, etc.), assembled at build time by the html-partials Vite plugin
• src/main.js: browser entry that imports styles, Alpine, and the app
• src/app.js + src/app/: the Alpine component, split into focused mixins
• src/parser/: SBOM parsing, run in a Web Worker
• src/graph/: the D3 force-directed graph renderer
• src/lib/: utility modules for formatting, licenses, security, and other shared logic