A powerful Visual Studio Code extension for visualizing biological structures and electron microscopy maps. Built on Mol*, BioViewer brings advanced molecular visualization directly into your development environment.
- 🗺️ Electron Microscopy Maps: Full support for MRC, MAP, and CCP4 volume files with proper visualization
- 🌐 Remote SSH Ready: Optimized for remote development with efficient file transfer
- 📦 Compression Support: Automatic .gz file handling saves bandwidth - especially valuable for remote connections
- 🧬 Multiple Formats: PDB, mmCIF, and all standard structural biology file formats
- 🔗 Database Integration: Direct access to PDB, AlphaFold, and EMDB databases
- Open Visual Studio Code
- Go to Extensions (
Ctrl+Shift+X/Cmd+Shift+X) - Search for "BioViewer"
- Click Install
| Command | Description |
|---|---|
BioViewer: Open Structure from Database |
Load from PDB, AlphaFold, or EMDB |
BioViewer: Open Files |
Open selected files in new tab |
BioViewer: Open Folder |
Load all supported files from directory |
BioViewer: Add Files to Current Tab |
Add files to active tab |
BioViewer: Add Folder to Current Tab |
Add all supported files from directory to active tab |
| Type | Extensions |
|---|---|
| Structures | .pdb, .cif, .mmcif, .mcif, .ent |
| Volume Maps | .mrc, .map, .ccp4 |
| Small Molecules | .sdf, .sd, .mol, .mol2, .pdbqt |
| Compressed | All above formats with .gz compression |
Right-click any supported file in VS Code Explorer → "BioViewer: Open Files"
BioViewer is optimized for remote SSH scenarios:
- Bandwidth Efficient: .gz files stay compressed during transfer
- Smart Decompression: Files decompress in browser, not on server
- Large File Handling: Memory-efficient processing of big datasets
- Visual Studio Code ^1.105.1 (for compatibility with Cursor)
- Modern web browser (for WebGL support)
This extension was inspired by molstar/VSCoding-Sequence and builds upon the powerful Mol* molecular visualization library.
Key Dependencies:
- Mol* (v5.7.0) - The core molecular visualization engine
- PDBe & RCSB PDB - Structural databases
- AlphaFold - AI protein structure predictions
- EMDB - Electron Microscopy Data Bank
git clone https://github.com/shuuul/bioviewer.git
cd bioviewer
npm install
prek install # Install git pre-commit hooks
npm run watch # Development mode
npm run compile # Production buildBioViewer uses prek to run pre-commit checks (linting, type checks, and file hygiene hooks) before commits.
- Open this repository in VS Code and run
npm install. - Start debugging with
F5(or Run and Debug) using theRun Extensionlaunch configuration. - VS Code opens an Extension Development Host window; run BioViewer commands there to reproduce issues.
- Set breakpoints in
src/**/*.{ts,tsx}(source maps map todist/**/*.js). - Check extension logs in Output panel ->
BioViewer. - For webview issues, run
Developer: Toggle Developer Toolsin the Extension Development Host and inspect console errors. - To debug tests, run
npm run compile-testsand launchExtension Tests.
MIT License - see LICENSE file for details.
Made with ❤️ for the structural biology community