--- title: "Embed MolDraw on Your Site | Free Molecule Editor Iframe" url: https://www.moldraw.com/blog/embed-moldraw.html description: "Embed the MolDraw editor on your site. Copy one iframe, paste it into a blog, course, docs page, or app, and set the frame height. Includes a live preview." lang: en publisher: Scidart Academy generated: 2026-11-02 --- ## On this page Who it is for Copy and paste Preview Size the frame Open in MolDraw FAQ # Embed the MolDraw editor on your site Published: 18 Sep 2026 · Author: Scidart Academy Add a live molecule editor to a chemistry blog, lesson, lab page, docs article, or app. Copy one iframe, paste it where the drawing should appear, and set the height so the canvas fits your layout. ![Illustration of a web page with the MolDraw editor embedded in an iframe, showing the caffeine structure](https://www.moldraw.com/blog/thumbs/embed-moldraw-editor.webp) One iframe puts the MolDraw editor inside any blog post, lesson or docs page. **Short version:** click Copy embed code, paste the snippet into your HTML, and start with a height of 640 pixels. Readers draw in place. Open in MolDraw opens the full editor in a new tab. ## Who it is for Use the embed when a reader should try a structure next to your explanation, not only look at a picture. - **Chemistry bloggers** — a working canvas under a reaction or structure post. - **Educators and LMS authors** — a drawing box on a lesson, lab manual, or problem set. - **Docs authors** — an editor beside a format, SMILES, or workflow note. - **App builders** — a ready editor frame inside a page that already has its own interface. You do not host the editor. The frame loads it from [https://www.moldraw.com/embed](https://www.moldraw.com/embed). Your page stays yours. ## Copy and paste Copy embed code puts this snippet on your clipboard. Paste it into the HTML of your page, an LMS HTML block, or the markup of your app. ``` ``` If the frame is blank, your site or course tool may block embeds. Use an HTML or embed block that allows iframes. If the platform still removes the frame, link to [www.moldraw.com](https://www.moldraw.com/) instead. ## Preview This is the same player the snippet loads. Draw a bond or pick a template. The bar at the top is part of the embed. ## Size the frame Width is 100% so the editor fills the column you drop it into. Height is 640 pixels, enough for the toolbar and a small structure. Raise the `height` number for a larger canvas. Drop it toward 480 on a short page, or use about 800 when readers need more room. On a phone, a tall frame means more scrolling. Match the height to the task: a quick sketch can stay shorter; a [reaction scheme](https://www.moldraw.com/tools/free-chem-tools/chemical-reaction-drawer.html) needs more space. ## Open in MolDraw Inside the player, **Open in MolDraw** opens the full editor at [www.moldraw.com](https://www.moldraw.com/) in a new tab. Your page stays open. Tell readers once: sketch here, and use Open in MolDraw if you want the full screen. ## FAQ ### Who is this for? Chemistry bloggers, educators, LMS authors, docs writers, and app builders who want a molecule editor beside their own text. It is a poor fit if you only need a logo or a screenshot. In that case, link to MolDraw or use an image. ### Do readers need an account? No. They can draw in the frame without signing up on your site. Open in MolDraw is there when they want the full editor. ### Can I change the size after I paste it? Yes. Edit `height` in the snippet. Leave `width="100%"` unless your layout needs a fixed width. The preview on this page is 640 pixels tall on a wide screen and shorter on a phone. ### The frame is blank. What now? A blank frame usually means the host blocks iframes. Switch to the platform’s HTML or embed block. If that still fails, send readers to [www.moldraw.com](https://www.moldraw.com/) with a normal link. Last updated: October 14, 2026 ## Related tools & guides Keep going with the [NMR spectrum viewer](https://www.moldraw.com/tools/nmr-viewer/index.html), [IR spectrum viewer](https://www.moldraw.com/tools/ir-viewer/index.html) and [mass spectrum viewer](https://www.moldraw.com/tools/mass-spec-viewer/index.html). They are free and run in your browser. [**NMR spectrum viewer**Open 1H and 13C NMR files](https://www.moldraw.com/tools/nmr-viewer/index.html)[**IR spectrum viewer**Find peaks and functional groups](https://www.moldraw.com/tools/ir-viewer/index.html)[**Mass spectrum viewer**Isotopes, adducts and losses](https://www.moldraw.com/tools/mass-spec-viewer/index.html)[**UV-Vis spectrum viewer**Lambda max, Beer-Lambert, band gap](https://www.moldraw.com/tools/uv-vis-viewer/index.html)[**Spectroscopy guides**All reading guides](https://www.moldraw.com/guides/)[**All chemistry tools**Converters, calculators, viewers](https://www.moldraw.com/tools/)[**MolDraw editor**Draw structures in your browser](https://www.moldraw.com/)[**Learn MolDraw**Short hands-on lessons](https://www.moldraw.com/learn/)