RDKit's slim WASM build makes no 3D. The molecule spins anyway.
Molsnap turns a SMILES string into a 2D structure, a spinnable 3D model, and a formula, all in the browser. The 3D comes from an in-house embedder, because the WASM build ships no conformer.
Paste CC(=O)Oc1ccccc1C(=O)O into the box and aspirin appears three ways at once: the flat
skeleton you'd draw on a whiteboard, a model you can grab and spin, and the line C9H8O4 /
180.16 g/mol. No sign-in, no upload, no server thinking about it somewhere. The whole thing
ran in the tab you already had open.
Molsnap exists because a SMILES string is the most common way molecules travel through papers, datasets, and problem sets, and the fastest way to see one is somehow still the hardest. Your options are desktop software you have to install, a web viewer gated behind an account, or a service that round-trips the string to a backend to do work a browser can do on its own. Molsnap is the scratchpad in between: paste, look, done. If the string is garbage it says so loudly, flashing the input and explaining in the status line, rather than quietly drawing you the wrong molecule.
Three libraries, three jobs, no overlap
The SMILES string goes to two parsers, not one. smiles-drawer handles the 2D: it reads the string and lays out bond geometry and ring shapes directly to a canvas. In parallel, RDKit compiled to WebAssembly re-parses the same string into a canonical molecule with every hydrogen made explicit. That RDKit molecule is the single source of truth for everything chemical. The same atom list feeds the Hill-notation formula, the molecular weight, and the 3D view, so the formula can never disagree with the model you're spinning. They are computed from one accounting, not stitched together from two.
The reason for the split is that each library is uniquely good at one thing and bad at the others. A canvas layout engine has no idea what an atom weighs; a cheminformatics engine doesn't do pretty 2D drawings. Asking either to cover the other's job gets you a worse version of both.
Lifting a flat drawing into 3D
Here's the part that took actual work. To make a molecule spinnable you need real 3D coordinates, and the natural place to get them is RDKit's conformer generator, ETKDG, which embeds a molecule into 3D space using known bond lengths and angles. Except the minimal RDKit WASM build, the one small enough to ship to a browser without a multi-megabyte download, doesn't expose a conformer API at all. It can parse and account for atoms. It cannot hand you coordinates.
So Molsnap grows its own. A small in-house embedder takes the flat 2D layout, which already has the connectivity right but sits entirely in one plane, and relaxes it into three dimensions using distance geometry: it treats bonds as springs that want to sit at their ideal length and pushes non-bonded atoms apart until the whole thing settles into a shape with depth. It is not as physically precise as ETKDG, and I'll say that plainly, but for "what does this roughly look like in 3D" it is exactly enough. The relaxed coordinates go out as a mol block, and 3Dmol.js renders it into the model you orbit with your mouse.
That constraint, no conformer in the slim build, is the whole reason the interesting code exists. If the easy path had been available I'd have taken it and there'd be nothing to write about.
Try it
Open Molsnap and it's already showing aspirin. Tap
one of the quick-picks (caffeine, ibuprofen, benzene, water) to swap molecules, or paste your
own SMILES and press render. Grab the 3D model and drag to orbit, scroll to zoom, and note
that every render syncs to the ?smiles= URL, so a shape you found is a link you can send.
If you'd rather read the embedder than trust it, the code is on GitHub.
This post is part of the build log: every app my automated factory ships gets written up here, honestly. Browse everything at apps.charliekrug.com. Comments are open below.
Loading comments…