How to Add an Electric Field Simulator to Your Website
LK Forge · 4 min read · Updated September 2026
You can add a full electric field simulator to any website, blog, or classroom page with a single line of code — free, with no sign-up, no plugin, and no script to install. Visitors drop positive and negative point charges onto a canvas and watch the field lines and vectors redraw around them instantly. This guide covers the fastest way to embed the tool, what it shows, and where it works.
The quickest way: paste one embed snippet
An embed is just an <iframe> that loads the simulator from lkforge.com, plus a small credit line. Copy this into your page’s HTML where you want the widget to appear:
<iframe src="https://lkforge.com/embed/electric-field/"
width="100%" height="740" loading="lazy"
style="border:0;max-width:560px"
title="Electric Field Simulator by LK Forge"></iframe>
<p><a href="https://lkforge.com/tools/physics/electric-field/">Electric Field Simulator</a>
by <a href="https://lkforge.com/">LK Forge</a></p> The <iframe> is the live simulator; the <p> underneath is a plain credit link. Keep that line — the visible link is what keeps the widget free to embed. You can also copy this exact code straight from the LK Forge widget gallery.
What the widget shows
The simulator starts on an empty canvas, so a visitor builds a charge arrangement by hand and the field appears as they go:
- Click to place charges: click empty space to drop a positive or negative point charge, using the add buttons to pick the sign.
- Drag and remove: drag any charge to move it and watch the field follow; double-click a charge to remove it.
- Field-line and vector modes: a view toggle switches between arrows sampled on a grid and smooth lines that flow from positive to negative.
- Charge strength and field detail: sliders raise the magnitude of the charges and how densely the field is drawn; a readout tracks the charge count and net charge.
Pick the right height
The snippet uses height="740", which fits the canvas, the add/clear/view controls, the sliders and the readouts without clipping even on a narrow phone, where they stack into one column. On a wider page the widget centres within its max-width:560px. That single height works across screen sizes, so there is nothing to tweak for mobile.
Where it works
Because it is a standard iframe, the embed works anywhere you can add HTML:
- WordPress: add a Custom HTML block and paste the snippet.
- Squarespace: use a Code / Embed block.
- Wix: add an Embed HTML / iframe element.
- Ghost: insert an HTML card.
- Notion: paste the
/embed/electric-field/URL and choose "Create embed". - Plain HTML, an intranet, or a lesson page: paste the snippet straight into the markup.
That’s the whole job. Copy the embed code from the widget gallery and paste it wherever a physics lesson or a blog post on Coulomb’s law, dipoles or field lines needs charges students can actually place and drag.
Grab the embed code from the LK Forge widget gallery — free, no sign-up.
Open the Electric Field SimulatorFrequently asked questions
- Is embedding the electric field simulator free?
- Yes. It is free to embed on any site, with no account, no API key and no usage limits. The whole simulation runs in your visitor’s own browser, so there is no server cost — we only ask that you keep the small "Electric Field Simulator by LK Forge" credit line that comes with the embed code.
- What can visitors do with the embedded simulator?
- They click empty space to drop positive or negative point charges, drag charges around to move them, and double-click one to remove it. A view toggle switches between vector arrows and flowing field lines, and sliders set the charge strength and the field detail. Build a dipole, a line of charges or a whole cloud and the field redraws around it instantly.
- Does the embed teach Coulomb’s law and superposition?
- Yes — that is its main teaching point. Each charge contributes an inverse-square field, and the simulator adds those contributions as vectors to get the field everywhere at once. Field lines stream out of positive charges and dive into negative ones, never cross, and crowd together where the field is strong, so Coulomb’s law and superposition become visible rather than abstract.
- What iframe height should I use, especially on mobile?
- The snippet ships with height="740", which is tall enough that the canvas, the add/clear/view controls, the sliders and the readouts all fit without clipping even on a narrow phone, where everything stacks into a single column. On a wider page the widget simply centres within its max-width of 560px. You can lower the height if you want it shorter, but 740 is the safe default across screen sizes.