HomeTrading Widgets › Live Forex Quotes Widget

Live Forex Quotes Widget

A quote board with the daily change and a five-day range, so a number has context rather than sitting on its own.

📈
Change %Against previous close
📊
5-day rangeHigh and low
🆓
FreeCommercial use allowed

i In short

A rate on its own tells a reader very little. USD/ZAR at 17.42 only means something next to where it was yesterday and where it has been this week. This widget is built around that idea: every pair shows the latest reference level, the change against the previous published close, and the high and low of the last five sessions, so a reader can see at a glance whether the rand has been drifting or has moved sharply.

It covers the rand against the dollar, euro, pound, Australian dollar, yen and yuan, with a second tab for the six major pairs. Rises and falls are colour-coded and marked with a direction arrow rather than colour alone, which keeps the board readable for colour-blind visitors and in a screen reader.

Be clear with your readers about what this is. These are indicative mid-market quotes derived from published daily closes, not streaming tick data and not a dealing price. Nobody is going to scalp from this board, and the widget states as much on its face. What it is good for is context: a reader deciding whether today's move is unusual, or a writer wanting a live figure next to an article rather than one that dates the moment it is published.

Everything is derived from one network request, runs in the reader's browser and records nothing. There is no key to register for and no quota to exceed.

Try the Live Forex Quotes Widget

Live previewThis is exactly what your readers will see

Embed code

Copy this into your page

Free for any site, including commercial ones. Keep the small credit line at the bottom of the widget so readers can find the full version. Nothing is stored about the people who use it. See the disclaimer.

How to add it to your site

  1. Copy the code above Use the copy button so nothing is lost to line wrapping. It is a single iframe tag and it does not need anything else.
  2. Open the page you want it on In WordPress add a Custom HTML block, in Wix use the Embed HTML element, in Squarespace use a Code block, and on a hand-built site paste it straight into your HTML.
  3. Paste and publish The widget appears immediately. If you see an empty space instead, your editor has stripped the iframe tag, which the HTML embed guide explains how to work around.
  4. Adjust the look if you want to Add the parameters in the table below to the iframe URL to change the theme, the accent colour or the height. Nothing needs to be configured on our side.

Customisation options

ParameterValuesWhat it does
themeauto, light, darkDefault follows the reader's own system setting, so the widget looks right on a dark site and a light one without you choosing.
accentSix hex digits, e.g. accent=1A56DBRecolours the header bar and the primary button to match your brand.
header1 or 0Set to 0 to hide the title bar when your page already has a heading above the widget.
breakdown1 or 0Set to 0 to hide the calculation breakdown for a more compact block.
corners1 or 0Set to 0 for square corners if your design has no rounding anywhere else.
widthfullRemoves the 520px maximum so the widget stretches to its container.

Parameters are added to the iframe URL as a normal query string, for example /embed/position-size-calculator.html?theme=dark&accent=1A56DB&header=0. The widget builder lets you set all of them visually and hands you the finished code.

What the widget calculates

The widget requests a short daily series for every pair on the board in a single call, then derives the latest level, the percentage change against the previous close and the five-session high and low from it. Pairs quoted the other way round are inverted on the page rather than requested separately, which is what keeps it to one request.

If the source is unreachable the board shows a short message and retries in the background rather than displaying a stale number. The reference date of the last close is always shown under the table.

Who this widget suits

Market commentary and news

A live board under a market report stops the article reading as though it were written last week.

Trading blogs

Useful in a sidebar, where a returning reader will check it before reading anything else.

Business and economics pages

Currency context for readers who are not traders but need to know which way the rand went.

Related widgets

The full library of free trading widgets has more than seventy tools, and the widget builder lets you preview and configure any of them before you copy the code.

Frequently asked questions

Is this real-time tick data?

No. The quotes are derived from published daily reference closes, so the change figure compares the latest close to the one before it. It is context for a reader, not a dealing feed, and the widget states that on its face so nobody mistakes it for a trading price.

What is the difference between this and the forex rates widget?

The rates widget shows the current level and its inverse, which suits a reader who wants to convert an amount. This one shows the level with a change percentage and a five-day range, which suits a reader who wants to know whether something has moved. Many sites run the rates board in a sidebar and this one on market pages.

Do I need to register anything?

No key, no account, no quota. The widget calls a free public endpoint that requires no registration and falls back to a second public source if the first is unavailable.

Why do some pairs show a dash?

A dash means the source did not return enough history for that pair to calculate a change, which happens occasionally with less liquid crosses or over long public holidays. The rest of the board still displays normally.

Can I use it on an AMP page?

AMP restricts arbitrary iframes, so it depends on your AMP configuration. On a standard responsive page there is no issue. If AMP is a requirement, link to the widget page rather than embedding it.

Does the colour coding work for colour-blind readers?

Yes. Every direction is marked with an arrow as well as a colour, and the percentage carries its own sign, so the information never depends on colour alone.

🛡️
Test the numbers on real prices

Try a Free Demo Account

Widgets show the maths. A demo account shows how the same maths behaves against live spreads and real market movement, without risking funds.

Open a free demo account
  • FSCA RegulatedTrade with confidence
  • Practice Risk FreeReal market conditions
  • Beginner FriendlyPerfect for learning

79% of retail CFD accounts lose money. Demo accounts do not guarantee future profits.