Trading UI Components & Market Data Widgets
Copy raw HTML, CSS & JavaScript snippets — drop them into any website, dashboard, or trading platform. All widgets connect to our market data API with a single API key.
Browse & pick
Filter by category — Dashboard, Trading, Analytics — and pick the component you need.
Enter your API key
Paste your RealMarketAPI key once. Every code snippet will have it pre-filled automatically.
Copy & embed
Copy the raw HTML/CSS/JS snippet and paste it directly into your app. Zero build step needed.
Live Price Ticker
Scrolling market tape with real-time prices and 24h change for all symbols. Requires Starter — uses the /price/market endpoint.
Market Price
XAUUSD
5,174.00
24h Change
+0.48%
Source
Real-time
Price Card
Single-symbol price card showing close price, 24h change indicator, and live status. Switchable between symbols.
| Symbol | Price | 24h Chg |
|---|---|---|
| XAUUSD | 5,174.00 | ▲ +0.48% |
| BTCUSD | 87,450.00 | ▲ +1.22% |
| EURUSD | 1.0812 | ▼ -0.11% |
| US500 | 5,803.42 | ▲ +0.33% |
| ETHUSD | 3,241.80 | ▲ +0.77% |
| GBPUSD | 1.2741 | ▼ -0.08% |
Market Overview
Compact multi-symbol table with live prices and directional change badges. Requires Starter — uses the /price/market endpoint.
Price Sparkline
Lightweight SVG line chart of recent closes. Ideal for compact dashboard tiles or news widgets showing price trend.
Connect your API key to load live candles
Candlestick Chart
OHLC candlestick visualization with wick lines and coloured bodies. Supports all timeframes available on your plan.
Pro plan required
Upgrade to Pro →RSI Gauge
Semicircular gauge displaying the Relative Strength Index (RSI) with colour-coded overbought and oversold zones.
Pro plan required
Upgrade to Pro →MACD Signal
MACD histogram with signal and MACD lines. Shows momentum cross signals favoured by technical analysts.
Pro plan required
Upgrade to Pro →SMA / EMA Overlay
Price chart overlaid with configurable Simple or Exponential Moving Average lines. Supports multiple MA periods simultaneously.
Bid
5,173.95
Ask
5,174.05
Bid/Ask Spread
Real-time bid and ask prices with live spread calculation. Essential for forex and crypto traders who need precise entry and exit points.
Volume Heatmap
Horizontal bar chart showing relative trading volume across all symbols in your plan. Requires Starter — uses the /price/market endpoint.
Open
5,164.69
High
5,197.28
Low
5,140.37
Close
5,174.00
OHLC Stats Card
Open, High, Low, Close card for a single symbol with 24h change. Great for concise tooltips or sidebar panels on any dashboard.
XAUUSD
+0.48%
BTCUSD
+1.22%
EURUSD
-0.11%
US500
+0.33%
ETHUSD
+0.77%
GBPUSD
-0.08%
XAGUSD
+0.61%
USDJPY
+0.04%
Change Heatmap
Color-coded tile grid showing 24h % change for all symbols. Hot green = rising, deep red = falling. Requires Starter — uses the /price/market endpoint.
Ready to embed live market data?
Start free — no credit card required. Upgrade when you need more symbols, timeframes, or indicator widgets.