3D Molecule Studio
A real 3D molecule you can spin, style and drop into your design - from a library, the periodic table, or a typed SMILES string.
Overview Extension #
A real 3D molecule you can spin, style and drop into your design - from a library, the periodic table, or a typed SMILES string.
3D Molecule Studio builds genuine three-dimensional molecules and drops them into your design. Reach for it three ways: pick from a curated library that runs from water, caffeine and glucose to a buckyball, a DNA double helix, graphene, diamond and a carbon nanotube; tap the periodic table for a single labelled atom, an element card or the whole table as a poster; or type a SMILES string or a plain formula and let a local generator fold it into 3D.
However it starts, it renders like a studio shot: ball-and-stick, space-filling or wireframe, with true CPK element colors you can override, matte-to-neon materials, studio lighting and a transparent, solid or gradient background. Recolor any atom, switch on element labels, and measure a bond length or angle by clicking atoms. You can also import exact geometry from a MOL, SDF or PDB file when you need real coordinates.
Open it from the Extensions menu. The molecule lands as a re-editable image layer with its own editable text caption; recolor, resize or restyle it and reopen anytime via Edit 3D Molecule Studio. Export a smooth 360-degree spin as a video.
Everything - the library, the SMILES 3D generator and file import - runs locally in your browser. Requires a browser with WebGL2 and real graphics, which every current desktop browser has.
Three ways in: library, elements, build Extension 9 items #
Pick a molecule from the curated library, build one from a periodic-table element, type a SMILES string or formula, or import an exact file.
Library
#The first tab: a curated set of ready-made molecules with real coordinates, each shown as a card with its name and formula. Click a card to load it.
Search molecules
#A search box above the library grid. Type part of a name or formula and the list filters live across every category.
Category chips
#Filter the library by group: All, Everyday, Organic, Biology, Mind (neurotransmitters and psychoactives) and Nano & crystals (buckyball, DNA, graphene, diamond, nanotube, salt lattice).
Surprise me
#Loads a random molecule from the library - a quick way to explore what is in there.
Elements
#The second tab: the full periodic table. Click an element to drop it in as a single labelled atom.
Insert periodic table poster
#Instead of a single atom, inserts the whole periodic table as a colored poster image - a ready-made layer for teaching or decor.
Tip. The poster is a flat 2D image, not a 3D scene.
Build
#The third tab: type a SMILES string (for example CC(=O)Oc1ccccc1C(=O)O) or a common formula (H2O, CO2, CH4) and the studio folds it into a 3D structure with a local distance-geometry generator.
Build molecule
#Turns the typed SMILES or formula into a molecule. Example chips below the field fill in common structures with one click.
Import MOL / SDF / PDB file
#Loads exact geometry from a chemistry file: MOL and SDF (V2000) or PDB. Bonds come straight from the file, or are inferred from atomic distances when it lists none, so large molecules keep their real coordinates instead of being relaxed.
Tip. The imported file stays with the layer, so re-editing rebuilds it from the same source.
Model, style and bonds Extension 7 items #
How the molecule is drawn: representation, surface material, bond coloring and the size of atoms and bonds.
Model
#The representation. Ball & stick shows atoms as spheres joined by rods; Space-filling shows atoms at full van der Waals size with no bonds; Wireframe shows thin atoms and thin bonds.
Style
#The surface material, lit by a studio environment. Matte, Glossy, Metal, Glass (translucent) and Neon (glowing).
Bonds
#How bonds are colored. Element color splits each bond into its two atoms’ colors; Neutral draws every bond in a single grey.
Atom size
#A slider that scales every atom sphere, from 0.6x to 1.6x, without changing bond geometry.
Bond thickness
#A slider that scales the bond rods, from 0.5x to 2x.
Atom labels
#Shows the element symbol on each atom as a crisp billboard label that always faces the camera.
Auto-spin
#Slowly rotates the molecule in the preview so you can see it in the round. Turn it off to hold a fixed angle.
Caption and info Extension 5 items #
An editable text caption under the molecule, and the About box that reads out its name, formula and mass.
Caption
#What the caption shows: None, the molecular Formula (with proper subscripts, e.g. C₈H₁₀N₄O₂) or the molecule’s Name.
Caption font
#The typeface for the caption, chosen with the editor’s full font picker. It stays editable on the caption layer after inserting.
Caption align
#Aligns the caption text: Left, Centre or Right.
Caption color
#The caption text color, from the internal color picker. It defaults to a dark tone so it reads on a light design, and is fully editable afterwards.
About
#A panel that reads out the current molecule: its name, formula, molar mass in g/mol, atom count and a one-line description for library molecules.
Atom colors and background Extension 3 items #
Override the color of any element, and set the studio backdrop behind the molecule.
Atom colors
#One color swatch per element present in the molecule. Each starts at its true CPK color (oxygen red, nitrogen blue, and so on) and can be overridden to any color.
Background: Type
#The backdrop behind the molecule: Transparent (drops onto your design as-is), Solid color, or Gradient.
Background: Colors
#The background color pickers: a single Base for a solid fill, or Base plus Gradient top for a vertical gradient. Hidden when the background is transparent.
Measure, preview and export Extension 5 items #
Read bond lengths and angles, preview against your design, and export the molecule as a layer or a spinning video.
Measure (click atoms)
#Turns on measuring: click two atoms to read the bond length in angstroms, or three to read the angle at the middle atom. Selected atoms get a bright highlight; dragging still orbits the view.
Show document
#Renders your current design behind the transparent molecule, so you can frame it against the artwork before inserting.
Drag to orbit, scroll to zoom
#The preview is a live 3D view: drag to orbit around the molecule and scroll to zoom.
Export spin
#Records one full turn of the molecule and downloads it as a WebM video (dark backdrop, about four seconds). Runs entirely in the browser.
Insert molecule / Update molecule
#Drops the molecule into your design as a re-editable image layer (grouped with its caption). When you reopen it from an existing molecule layer, the button reads Update molecule and edits that layer in place.