Interactive tools

Structure Explorer: visualize any PDB or AlphaFold model in your browser

37degrees Team
Share
Structure Explorer: visualize any PDB or AlphaFold model in your browser

Why a structure viewer matters now

AlphaFold turned every UniProt entry into a candidate 3D model, and the PDB still adds tens of thousands of experimentally solved structures every year. Looking at a structure — really rotating it, picking residues, seeing chains — is no longer a niche skill; it’s the fastest way to reason about a target. This widget is a one-input, no-install way to do it from any article, lab page, or course handout.

Use it now

Found a bug or want a feature? Tell us — we read everything.

What it shows

Paste a 4-character PDB ID (e.g. 1AKE, 6VXX) or a UniProt accession (e.g. P00533) and the widget fetches the corresponding mmCIF file and renders it interactively.

Inside the viewer you can rotate (drag), zoom (scroll), pan (right-drag), expand to full screen, toggle the sequence panel, hover residues for identity, and pick atoms to focus. Coloring defaults to per-chain so multi-subunit complexes are immediately legible.

How it works

  • Rendering: Mol* is loaded from jsDelivr CDN on demand. It’s the same WebGL viewer used by RCSB PDB, PDBe, and the AlphaFold Database — MIT licensed.
  • Data: PDB IDs resolve to https://files.rcsb.org/download/{ID}.cif; UniProt accessions resolve to https://alphafold.ebi.ac.uk/files/AF-{ID}-F1-model_v4.cif. Both endpoints are public and CORS-enabled.
  • Backend: none. The page calls the public APIs directly from the browser; we host only the wrapper UI.

Embed it on your site

Drop this snippet anywhere — a static page, a course site, a notion-of-record entry, your lab’s wiki:

<link
  rel="stylesheet"
  href="https://www.37degrees.io/interactive-tools/molstar-structure-explorer/styles.css"
/>
<div id="structure-widget-embed"></div>
<script>
  // Optional. Omit for the default dark theme.
  window.STRUCTURE_THEME = "light";
</script>
<script src="https://www.37degrees.io/interactive-tools/molstar-structure-explorer/widget.js"></script>

No bundler, no build step, no API key. Everything runs in your visitors’ browsers.

Credits

  • Mol* viewer — Sehnal D., Bittrich S., et al. Mol* Viewer: modern web app for 3D visualization and analysis of large biomolecular structures. Nucleic Acids Research, 2021. Paper · GitHub
  • Structures served by RCSB PDB and the AlphaFold Protein Structure Database (EMBL-EBI · DeepMind)
Share this article