TradingCalc
WIDGETS · 67 TOOLS · FREE

Put a TradingCalc calculator on your site

Any of the 67 calculators and checkers can sit on your page as a widget, with your colors, free and without an account. This page is the installation guide, the option reference, the troubleshooting list and the FAQ. To pick a widget and set the options with a live preview, use the configurator.

OPEN THE CONFIGURATOR →
01INSTALL

Quick start

Four steps, about two minutes.

  1. 1Open the configurator and pick a widget from the list. Each calculator page also shows its own embed code under the calculator.
  2. 2Optional: choose the theme, the accent color, the background and compact spacing. The preview shows the widget exactly as your visitors will see it.
  3. 3Click "Copy embed code" and paste it into your page, in a block that accepts custom HTML (a Custom HTML block, an Embed element, a Code block or an HTML card, whatever your editor calls it).
  4. 4Publish and open the live page. Check that the widget loads and that the text link under it is there.
02CHOOSE A FORM

Script or iframe

Both forms show the same widget and both include the text link. Pick by what your editor allows.

Script (recommended)

A small div plus one script tag. The frame starts at 640 px and then takes the exact height of the widget as the result appears, so there is never a scrollbar inside it. The script is a few kilobytes, loads asynchronously and reads nothing from your page except its own div.

html
<!-- TradingCalc widget: please keep the link below exactly as given (address and words) -->
<div class="tradingcalc-widget" data-widget="black-scholes-calculator"><a href="https://tradingcalc.io/black-scholes-calculator?utm_source=embed&amp;utm_medium=backlink&amp;utm_campaign=black-scholes-calculator">Black-Scholes Option Calculator by TradingCalc.io</a></div>
<script async src="https://tradingcalc.io/embed.js"></script>

Iframe

One plain tag, for editors and sites that do not allow script tags. The height is fixed at the value in the code (640 px). A widget that shows a long result scrolls inside the frame; raise height if you prefer.

html
<!-- TradingCalc widget: please keep the link below exactly as given (address and words) -->
<iframe src="https://tradingcalc.io/embed/black-scholes-calculator" width="100%" height="640" style="border:none;max-width:640px;color-scheme:normal" title="Black-Scholes Option Calculator by TradingCalc.io" loading="lazy" allow="clipboard-write"></iframe>
<p style="font-size:12px;margin:4px 0 0"><a href="https://tradingcalc.io/black-scholes-calculator?utm_source=embed&amp;utm_medium=backlink&amp;utm_campaign=black-scholes-calculator">Black-Scholes Option Calculator by TradingCalc.io</a></p>

The widget is at most 640 px wide and works down to a 320 px screen. Put it in a column of your own width and it centers or aligns as your page does.

03OPTIONS

Options

Every option is optional. In the script form it is a data- attribute on the div; in the iframe form it is a query parameter on the frame address. The configurator writes both for you.

THEME
data-theme="light"tc_theme=light

Dark is the default. Light turns the cards white and the text dark; the text contrast is tested on every widget.

ACCENT COLOR
data-accent="#6d28d9"tc_accent=6d28d9

A hex color for links, highlights and buttons (default #e8b4b8 on dark, #962f4c on light). It is ignored, and the default is used, when it is too dark or too light to read on the theme, or when it is red, amber or green: those three are the verdict colors inside the calculators, and the accent also marks the neutral verdict.

BACKGROUND
data-bg="transparent" or data-bg="#f1eee7"tc_bg=transparent

The space around the cards: the theme default, transparent to show your page, or a hex color. The cards themselves follow the theme.

COMPACT
data-compact="1"tc_compact=1

Less padding around the widget, for a narrow column or a sidebar.

START VALUES
data-start="spot=77777&strike=88888"spot=77777&strike=88888

Opens the widget with your numbers filled in. See the next section.

HEIGHT
data-height="700"height="700" on the tag

Where the frame starts before the widget reports its own size (script form), or the fixed height (iframe form). The default is 640.

All options at once
<!-- TradingCalc widget: please keep the link below exactly as given (address and words) -->
<div class="tradingcalc-widget" data-widget="black-scholes-calculator" data-theme="light" data-accent="#6d28d9" data-bg="transparent" data-compact="1" data-start="mode=manual&amp;spot=77777&amp;strike=88888&amp;days=45&amp;vol=55&amp;rate=3"><a href="https://tradingcalc.io/black-scholes-calculator?utm_source=embed&amp;utm_medium=backlink&amp;utm_campaign=black-scholes-calculator">Black-Scholes Option Calculator by TradingCalc.io</a></div>
<script async src="https://tradingcalc.io/embed.js"></script>
04START VALUES

Start values

To open a widget with your own example, fill the calculator on its own page, press "Copy share link", and paste that link into the "Start values" box of the configurator. It takes the numbers out of the link and puts them into the code.

By hand it is the part of the share link after the question mark: https://tradingcalc.io/black-scholes-calculator?mode=manual&spot=77777&strike=88888 becomes data-start="mode=manual&spot=77777&strike=88888". Tracking parameters and the options above are dropped on purpose.

A few tools always open empty and have no start values: Risk Parity Calculator, Does This Bet Have Edge?, Is This Token a Rug Pull Risk?, Swap Price Impact Calculator, Crypto Wallet Checker, Pump.fun Bonding Curve Calculator, Impermanent Loss Calculator, Crypto Market Cap Calculator. The configurator greys the box out for them.

05THE LINK

The text link

Every snippet ends with one plain text link to the calculator's own page, and starts with a one-line comment that says to keep it. The widget is free; the link is the thanks.

  • Keep the link as given, with its address and its words. It sits in your own page, next to the widget, and it takes readers to the full calculator with its guide and FAQ.
  • In the script form the link is inside the div; the script puts the widget above it and leaves the link where it is. If your editor drops the contents of a div when you save, add the link back exactly as in the code.
  • Inside the widget there is a second, small link ("Calculator by TradingCalc.io") that opens in a new tab. It is not a replacement for the one in your page.
  • The "Calculated by TradingCalc" badge on the configurator page is a separate, optional way to say thanks, for a page that shows our numbers without a widget.
06YOUR READERS

For your readers

Your visitors do not need an account or any setup. Here is what they get, and a paragraph you can paste above the widget if you want to explain it.

  • The result updates as they type. Inputs that cannot be read (a half-typed number, a comma where a dot is expected) show a hint instead of a wrong result.
  • "Copy share link" copies a link to the same calculation on tradingcalc.io, with their numbers in it, so they can save it or send it.
  • Links inside the widget open in a new tab and never replace your page.
  • Nothing they type is stored, and it is not sent to analytics. The link they copy is the only place their numbers go. The three on-chain checkers (wallet, token risk, swap) have to look an address up with their data sources to answer.
  • Every calculator has a full guide, a worked example and a FAQ on its own page; the text link under the widget leads there.

Text you can paste above the widget

How to use this calculator: type your numbers into the fields and the result appears as you type. Nothing you enter is saved. "Copy share link" gives you a link to the same calculation. The calculator's own page has a full guide and a FAQ.
07TROUBLESHOOTING

Troubleshooting

Most problems come from the page, not from the widget. Each line names the cause and the fix.

Nothing appears, only the text link

CAUSE The editor removed the script tag, or it does not run scripts in preview.

FIX Open the published page, not the editor preview. If it is still empty, use the iframe form, or ask the site owner for the permission to add custom HTML (WordPress removes script and iframe tags for roles without the unfiltered_html capability).

An empty box or "refused to connect"

CAUSE Your site sends a Content-Security-Policy that blocks the frame, or the frame address is not an embed address.

FIX Allow https://tradingcalc.io in frame-src (or child-src) and, for the script form, in script-src. Only addresses that start with /embed/ can be framed by other sites; a normal calculator page address is refused on purpose.

A scrollbar inside the widget, or the bottom is cut off

CAUSE The iframe form has a fixed height.

FIX Use the script form, which sets the height itself, or raise height in the iframe tag.

My accent color is not used

CAUSE The color is too dark or too light for the theme, is not a hex value, or is red, amber or green.

FIX Pick another hue (blue, purple, teal and pink work) or switch the theme. The configurator shows why a color was refused.

The start values do not fill in

CAUSE The tool has no start values, or a name in the list does not match a field.

FIX Copy the share link from the calculator page and paste it into the configurator instead of typing the names.

The widget is dark on my dark page and I want it to blend in

CAUSE The background is the theme default.

FIX Set the background to transparent (or to your page color); the cards stay solid so the text stays readable.

The page jumps when the widget loads

CAUSE The frame starts at 640 px and then takes the real height.

FIX Set data-height to the height you expect, or reserve that space in your layout.

08WIDGET KEYS

All 67 widgets

The key is the value of data-widget (or the last part of the iframe address). The link on each title goes to the calculator page, which has its guide and FAQ. The suite key suite is one widget with the 12 crypto futures calculators behind a dropdown.

CRYPTO PERPETUAL FUTURES

OPTIONS

FOREX

RISK AND STATISTICS

PREDICTION MARKETS

ON-CHAIN

CRYPTO SPOT

TRADE WORKFLOWS

09FAQ

FAQ

Is it free?

Yes. No signup, no API key. The only ask is to keep the text link that comes with the code.

Can I change the text or the language of the widget?

No. The widgets are in English and their wording is the same as on tradingcalc.io, which is what keeps every result checkable. You can change the colors, the theme and the spacing.

Does it work on my phone and on other people's phones?

Yes, from a 320 px wide screen up. The widget adapts to the width of the column you put it in, up to 640 px.

Where do the numbers come from, and are they live?

The formulas are the ones behind the calculator pages and the API; the methodology page lists their sources. Widgets that use a live price, a funding rate or an on-chain check fetch it when they load, so there is nothing for you to update.

Is anything my visitors type stored?

No. The values typed into a calculator are not stored and not sent to analytics; see the privacy policy. The three on-chain checkers look an address up with their data sources, because that is what they do. The widget page runs the same analytics scripts as tradingcalc.io (PostHog and Google Analytics, no advertising cookies), so mention it in your own privacy policy if your rules require it.

Can I put several widgets on one page?

Yes. Each snippet is independent, and each comes with its own text link.

Is there a limit on traffic?

Widgets that call live data or an on-chain check go through our servers, and each visitor's address is limited to a number of requests per minute, so ordinary traffic is fine. If you expect a very busy page, write to us first.

Will the code stop working?

The loader file embed.js keeps working for pages that already include it. A change that would alter what an existing snippet does gets a new file name instead. The widget keys do not change.

Can other sites frame my calculator page?

Only the widget addresses (/embed/...) can be framed by other sites. Every other page of tradingcalc.io refuses to be framed, which protects visitors from a fake overlay on top of a calculator.

I build tools or bots. Is there something more than a widget?

Yes: the same calculations are available over an HTTP API and an MCP server, see the API and MCP reference.

Still stuck?

Write to us through the support page with the address of your page and a line about what you see. A screenshot of the browser console helps.