Widgets

How to Add a Beer's Law Calculator to Your Website

LK Forge · 4 min read · Updated September 2026

You can add a full Beer's Law calculator 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 move sliders for concentration, path length and molar absorptivity and watch the Beer–Lambert law A = ε·b·c play out, then push it until the calibration curve bends — the linearity ceiling every analytical chemist runs into. This guide covers the fastest way to embed the Beer's Law Calculator, what it teaches, and where it works.

The quickest way: paste one embed snippet

An embed is just an <iframe> that loads the calculator 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/beers-law/"
        width="100%" height="900" loading="lazy"
        style="border:0;max-width:560px"
        title="Beer's Law Calculator by LK Forge"></iframe>
<p><a href="https://lkforge.com/tools/chemistry/beers-law/">Beer's Law Calculator</a>
   by <a href="https://lkforge.com/">LK Forge</a></p>

The <iframe> is the live calculator; 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 calculator opens on a clean calibration curve, so a visitor sees the relationship immediately and can then take control:

  • Concentration, path length, ε: the three sliders in A = ε·b·c — change any one and the absorbance and the plotted point move together.
  • Stray light and polychromatic beam: switch on the real-instrument effects and watch the straight line curve away from ideal Beer's law behaviour.
  • Live A and %T readout: absorbance and percent transmittance are shown side by side, so the log relationship between them is easy to read.
  • Reset: one button returns every slider to a baseline, handy for classroom demos.

Pick the right height

The snippet uses height="900", which fits the plot, 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/beers-law/ 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 an analytical-chemistry lesson or a blog post on spectrophotometry, calibration or the Beer–Lambert law needs a curve students can actually bend.

Grab the embed code from the LK Forge widget gallery — free, no sign-up.

Open the Beer's Law Calculator

Frequently asked questions

What can visitors do with the embedded Beer's Law Calculator?
They can drag sliders for concentration c, path length b and molar absorptivity ε and watch the absorbance and %T update instantly. Adding stray light or a polychromatic beam bends the calibration curve away from the ideal straight line, and a Reset button returns everything to a clean baseline.
What does the Beer's Law Calculator teach?
It shows the Beer–Lambert law A = ε·b·c as a live equation and a plot. The straight-line region is the linear range analysts rely on; push concentration high, or add stray light, and the curve visibly bends — a direct picture of why real calibration curves deviate from Beer's law at high absorbance.
Is embedding the Beer's Law Calculator 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 "Beer's Law Calculator by LK Forge" credit line that comes with the embed code.
What iframe height should I use, especially on mobile?
The snippet ships with height="900", which is tall enough that the plot, the sliders and the readouts all fit without clipping even on a narrow phone, where they stack 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 900 is the safe default across screen sizes.
Where can I embed it — WordPress, Wix, Squarespace, Notion?
Anywhere you can add HTML, because it is a standard iframe. In WordPress use a Custom HTML block; in Squarespace a Code/Embed block; in Wix an Embed HTML element; in Ghost an HTML card; in Notion paste the /embed/beers-law/ URL as an embed. On a plain HTML page or an intranet, paste the snippet straight into the markup.
Does the embedded calculator track visitors or set cookies?
No. Everything runs locally in the visitor’s browser — nothing is uploaded. The embed sets no tracking cookies and sends no analytics, so it is safe to place on a privacy-sensitive site, an intranet, or a page for students.