Home>Embed

Free Embeddable Calculator Widgets for Your Website

Add a CPM, CPC, CTR, ROAS, or platform-specific ad calculator to any website in under 60 seconds. Pick a calculator, customize the colors, copy the code, paste it. Free forever with a small Powered by CPMKit link.

15 Calculators
Custom Colors
Light & Dark Themes
#

Show industry averages on supported calculators

<div data-cpmkit-calculator="cpm"></div>
<script src="https://cpmkit.com/embed.js" async></script>

Using WordPress? Paste this code into a Custom HTML block in the editor. A dedicated WordPress plugin is coming soon.

Live Preview

Current iframe dimensions: 0px × 400px

How Does the CPMKit Embeddable Widget Work?

The widget loads your chosen calculator inside a lightweight iframe on your page. All calculations run in the visitor's browser. No data is sent to CPMKit servers. The embed code is two lines of HTML that work on any website.

1

Choose a Calculator

Pick from 15 advertising calculators including CPM, CPC, CTR, ROAS, YouTube, Facebook, and more.

2

Customize the Look

Match your site colors, pick light or dark theme, toggle benchmarks on or off.

3

Copy & Paste

Grab the two-line embed code and paste it into any HTML page, WordPress post, Webflow site, or landing page builder.

Which Calculators Can I Embed?

You can embed any of our 15 calculators entirely for free. Every calculator works identically to the full version on CPMKit.com, just without the surrounding content. Choose from core metrics like CPM and CPC, or platform-specific tools for YouTube and TikTok.

Core Metrics

Ad Platforms

Planning & Specialty

Who Should Use the CPMKit Widget?

The CPMKit embeddable widget is designed for any website that serves digital marketers, media buyers, agency professionals, or e-commerce founders. If your audience deals with advertising metrics or campaign planning, an interactive calculator provides immediate value right on your page.

Marketing Blogs and Content Sites

If you write about advertising, media buying, or digital marketing, embedding a working calculator inside your article adds interactive value that keeps readers on your page longer. A blog post explaining CPM benchmarks with a live, functional calculator embedded mid-article significantly outperforms a static post with just text, improving engagement and dwell time.

Digital Agencies and Consultants

Embed a calculator directly on your agency's services page or resource center. It demonstrates expertise without explicitly saying "we are experts." Potential clients can run their own numbers and forecast budgets before they ever hop on a sales call, qualifying themselves while building trust in your agency's data-driven approach to paid media.

Ad Tech Tools and SaaS Platforms

If your product handles media buying, campaign management, or ad analytics, embedding a CPM or ROAS calculator on your public marketing site adds immense utility that competitors without it lack. It attracts high-intent visitors searching for calculators and seamlessly introduces them to your core SaaS offering while they solve their immediate math problems.

E-learning and Certification Sites

Course pages and learning modules about digital advertising can embed the calculator as a hands-on, interactive exercise. Instead of just reading about formulas and theoretical ad spend, students learn actively by calculating real numbers. They can experiment with different inputs and see the resulting metrics instantly, which drastically improves concept retention and student satisfaction.

How Do I Customize the Widget Appearance?

Use the configurator above to change the accent color, switch between light and dark themes, and toggle benchmark comparisons on or off. The preview updates in real-time. Once it looks right, copy the code.

Accent Color

The accent color controls buttons, focus rings, and highlighted results. Pick from 6 presets or enter any hex code to match your brand.

Light and Dark Themes

Light theme uses a white calculator card on any background. Dark theme uses a midnight navy card that fits dark-themed websites and dashboards.

Benchmark Comparison

When enabled, the widget shows industry and platform benchmark gauges below the calculator inputs. This adds height to the embed but gives users context for their results.

Where Can I Embed the Widget?

The widget works flawlessly on any website platform that supports custom HTML. Because it uses a lightweight iframe and no external dependencies, it will never conflict with your site's existing CSS or JavaScript. Here is how to embed it:

WordPress

Paste the embed snippet directly into a Custom HTML block in the Gutenberg editor.

Webflow

Drag and drop the Embed Code component onto your canvas and paste the snippet inside.

Squarespace

Add a Code Block to your page, ensure it is set to HTML, and paste the code.

Wix

Add an HTML iframe embed element to your page and paste the code into the provided box.

Shopify

Paste the code into a Custom Liquid section or directly into a page's HTML editor view.

Ghost

Insert an HTML card into your post or page editor and paste the snippet.

Static HTML Sites

Simply paste the two lines of code anywhere between the body tags of your HTML file.

React / Next.js / Vue

Paste the script tag in your index.html, or safely inject the HTML snippet using dangerouslySetInnerHTML.

Notion

Type /embed and paste the script URL (limited styling support depending on Notion's iframe restrictions).

Frequently Asked Questions About the Embeddable Widget

Is the embeddable widget really free?

Yes. The free version includes all 15 calculators with full functionality. The only requirement is keeping the Powered by CPMKit link visible. No signup, no API key, no usage limits.

Does the widget slow down my website?

No. The widget loads inside an iframe which does not block your page rendering. The script is under 2KB and loads asynchronously. The calculator itself runs entirely client-side with zero API calls.

Can I use the widget on a commercial website?

Yes. Free and Pro embeds are both approved for commercial use including agency sites, SaaS marketing pages, and monetized blogs.

Does the widget collect visitor data?

No. All calculations happen in the visitor's browser. No data is sent to CPMKit servers. No cookies are set by the embed. No analytics are collected from embedded instances in the free version.

Can I embed multiple calculators on the same page?

Yes. Add multiple div elements with different data-cpmkit-calculator values. Include the embed.js script only once. It will initialize all calculators on the page.

Does the widget work with WordPress?

Yes. Paste the embed code into a Custom HTML block in the WordPress block editor. A dedicated WordPress plugin with a Gutenberg block is planned for future release.

Can I remove the Powered by CPMKit link?

The Pro embed plan (coming soon) includes white-label support. The free version requires the branding link to remain visible. Removing it without a Pro license violates the terms.

What happens if CPMKit updates the calculator?

Updates apply automatically. The embed loads the latest version from CPMKit servers each time. We avoid breaking changes but cannot guarantee it. Major changes will be announced in advance.