Molecule Drawing
Draw atoms, bonds, rings, functional groups and chemical structures in a browser-based editor.
JSME Editor
JSME Editor for browser-based molecule and reaction drawing.
A free, open-source JavaScript molecule and reaction editor that runs in modern browsers without plugins. Useful for chemistry websites, education tools, scientific interfaces, cheminformatics workflows, structure input, SMILES generation and molecule editing demos.
JS
Browser
SMILES
Output
MOL
Import
BSD
License
Molecule editor preview
Chemical structure
Draw molecules in browser
Plugin-free
SMILES
Structure output
Molfile
V2000 / V3000
Input
Output
Device
Status
Draw
SMILES
Desktop
Ready
MOL
SVG
Mobile
Live
Open Source Attribution
This page is for the JSME editor project repository. JSME is an open-source molecule editor originally developed by Peter Ertl and Bruno Bienfait and released under the BSD-3-Clause license.
Why JSME
A chemistry editor that runs directly in the browser.
JSME is useful when a web application needs molecule input, reaction drawing, structure sharing, SMILES output, MOL import/export, SVG rendering or chemistry education workflows without browser plugins.
Browser-first editor
Pure JavaScript experience that can run in modern browsers without plugin dependency.
Touch-ready workflow
Supports use cases across desktop, tablet and phone interfaces.
Reactions & mapping
Draw reactions, modulators and reaction mapping natively.
Export-friendly
Generate structure output such as SMILES, SMARTS, Molfile and SVG exports.
Feature Suite
Molecule editor features for scientific web interfaces.
JSME provides the core editing, import/export and browser integration capabilities needed for chemistry-focused web products.
Reaction Editing
Create reaction diagrams, modulators and mapping workflows for chemistry applications.
SMILES & SMARTS
Generate canonical SMILES and SMARTS for structure exchange, substructure search and downstream workflows.
Molfile I/O
Read and write MDL/Symyx Molfile formats, including V2000 and V3000 output workflows.
SVG Export
Render chemical structures as SVG for previews, documentation, sharing and scientific interfaces.
Keyboard Shortcuts
Supports keyboard-first editing for atoms, bonds, rings and common chemistry drawing actions.
Use Cases
Where JSME Editor fits best.
JSME is useful when users need to enter chemical structures directly inside a website or web application instead of uploading files or using desktop-only chemistry tools.
Chemistry Education
Interactive chemistry learning tools, assignments and molecule drawing practice.
Substructure Search
Let users draw structures and generate SMARTS for search workflows.
Research Tools
Scientific apps that need chemical structure input and molecule previews.
Chemical Databases
Database forms, molecule records, compounds, reactions and metadata entry.
Pharma Interfaces
Drug discovery dashboards, molecule submissions and structure workflows.
Developer Demos
Embedding examples, API playgrounds and integration proof-of-concepts.
Integration Options
Add molecule editing to a website or product interface.
JSME can be embedded as an npm package or static script, then connected to forms, databases, search workflows, dashboards or scientific interfaces.
NPM Package
Install the package and integrate JSME into a modern JavaScript project or frontend workflow.
npm install jsme-editor
Static Script
Drop the JSME distribution folder into a project and initialize the editor with a script tag and callback.
<script src="jsme/jsme.nocache.js"></script>
Developer Resources
Repository includes docs, examples and runtime files.
The repository includes a landing page, user guide, design system, distribution folder, API docs, examples, developer tests, release notes and downloadable builds.
Documentation
Embedding guide, API reference, help page and toolbar reference.
Examples
Integration examples, test pages, implementation guide and API playground.
Distribution
Browser-optimized runtime bundles, downloadable zips and release notes.
BSD-3-Clause
Open-source license suitable for commercial and academic use.
Related Services
Need this embedded into a real product?
I can help plan frontend integration, data capture, API flows, chemistry forms, custom dashboards and product UI around browser-based scientific tools.
React / Next.js Development
Build scientific interfaces, dashboards, product frontends and API-connected web apps.
View React PageWebsite Development Services
WordPress, Shopify, Webflow, Framer, React, Next.js, dashboards and full-stack websites.
View Website ServicesFAQ
Common questions.
What is JSME Editor?
JSME Editor is a free, open-source JavaScript molecule and reaction editor that runs in modern browsers and allows users to draw, edit, import, export and share chemical structures.
Can JSME run without browser plugins?
Yes. JSME is a JavaScript-based editor designed to run directly in modern browsers without a plugin requirement.
What formats does JSME support?
JSME supports outputs such as SMILES, SMARTS, JME strings, SVG rendering and Molfile workflows including V2000 and V3000.
Can this be embedded into React or Next.js?
Yes. JSME can be integrated into modern web applications using npm or static script workflows, then connected to forms, APIs, databases and dashboards.
What license does JSME use?
JSME is released under the BSD-3-Clause license, which allows use in commercial and academic projects according to the license terms.
Scientific Web Integration
Need a molecule editor inside your web product?
Share your product type, chemistry workflow, required structure formats, frontend stack, API needs and database flow. I can help you plan the right browser-based molecule editing integration.
JSME integration inquiry
Elementor Pro form connected here.