Launch offer30% off Starter for 3 months — first 100 subscribers — plus 10% off any annual plan. Ends September 15, 2026.30% off Starter · 10% off annual · ends September 15, 2026Get the codes →
/ Embeddable widget
A container calculator, on your website
Give your visitors an instant "will it fit?" answer without sending them away. Two lines of HTML embed the real ContainerMath 3D packing engine — white-labeled to your brand, locked to your domain, metered on your plan.
/ Install
Two lines. Any site.
Configure it, copy it, paste it. The CBM calculator is free and needs no account — it runs entirely in your visitor's browser, so there's nothing to sign up for and nothing to meter.
Paste this into your page
<script src="http://127.0.0.1:4321/embed.js"
data-widget="cbm"
async></script>
<div id="containermath-embed"></div>Live preview
Powered by ContainerMath
That attribution line is part of the free widget and can't be switched off — it's what the free tier is exchanged for. The Pro Plus planner supports data-attribution="false".
Works on WordPress, Webflow, Shopify pages, plain HTML — anywhere you can paste a script tag. For the 3D planner, mint a publishable key (and set its domain allowlist) in Developers → Embed once you're signed in.
/ Configure
Attribute reference
| Attribute | Required | What it does |
|---|---|---|
| data-widget | Optional | "cbm" for the free, keyless CBM calculator (the default when no data-key is present), or "planner" for the 3D load planner. |
| data-key | Optional | Required for the 3D planner only. Your publishable key (cm_pk_…) from Developers · Embed. Safe to expose — it only works on domains you allowlist. The free CBM widget needs no key. |
| data-units | Optional | metric (default, cm/kg) or imperial (in/lb) — the units the widget opens in. |
| data-container | Optional | Preselected vessel, e.g. 40ft-standard or 20ft-standard. |
| data-theme | Optional | light (default) or dark. |
| data-accent-color | Optional | Hex accent (no #) for buttons and highlights — white-label it to your brand. |
| data-bg-color | Optional | Hex background (no #). |
| data-height | Optional | Widget height in px (default 430 for the CBM widget, 520 for the planner). |
| data-target | Optional | Id of the div to render into (default containermath-embed). |
| data-attribution | Optional | Set to "false" to remove the small "Powered by ContainerMath" link under the widget. Honoured for the 3D planner only — the free CBM widget always shows it. |
/ Why embed it
Built for real sites
The real 3D engine
Visitors get the same Three.js 3D load view and packing engine the full app uses — not a volume-divider toy.
White-label theming
Light or dark, your accent and background colors — the widget disappears into your site's design.
Domain-locked keys
For the 3D planner, publishable keys are bound to a domain allowlist and verified server-side per request. No secrets in the page.
Free tier runs client-side
The CBM widget does its math in the visitor's browser — no key, no account, no quota. The 3D planner meters against your existing API quota.
Two-line install
One script tag, one div. No build step, no SDK, works on any CMS or static site.
Useful to your visitors
Forwarders, packaging suppliers and logistics blogs give readers an instant answer to "will my cargo fit?" without leaving the page.
/ FAQ
Frequently asked questions
Is the embeddable widget free?
The CBM calculator widget is free on every plan, and needs no account at all — add data-widget="cbm" and it works. It computes volume, weight and container fit entirely in the visitor's browser, so there is no key, no quota and nothing to sign up for. The full 3D load planner widget is the paid one: minting a publishable key requires Pro Plus or Custom, and its calculations are metered against that account's monthly API quota.
What's the catch with the free widget?
The "Powered by ContainerMath" link under it. That link is required on the free CBM widget and cannot be turned off — it is what the widget is exchanged for. Everything else is unrestricted: no domain allowlist, no request cap, no expiry. The paid planner widget can remove the link with data-attribution="false".
How is the embed secured?
The widget authenticates with a publishable key (cm_pk_…) that is safe to put in a public page: the server validates every request's Origin against the key's domain allowlist, so the widget only works on domains its owner approved. Secret API keys are never used in the browser.
Can I remove the "Powered by ContainerMath" link?
On the paid 3D planner widget, yes — add data-attribution="false" to the script tag. On the free CBM widget the link is mandatory and the attribute is ignored.
Does each visitor calculation cost me money?
The free CBM widget costs nothing and never touches our servers — the math runs in the visitor's browser. For the paid planner widget there is no separate charge either: calculations draw from your plan's existing monthly API request quota, and the rate limiter protects you from abuse.
What does the visitor see?
With the free CBM widget: a compact form where they enter cargo dimensions, weight and quantity, and get total CBM, CFT, weight and how full a 20ft, 40ft or 40ft High Cube would be. With the paid planner: the same input plus a live 3D load plan showing placement, fit and utilisation — themed to your site.
Ship it before lunch
Sign up, mint a publishable key on the Pro Plus plan, paste the snippet — your visitors are planning loads on your site today.
ContainerMathThe industry standard for 3D container cargo packing and loading plans. Optimize layouts, maximize volume, and reduce shipping overhead.
Built by Backrock Studios