Free order flow & heatmap widget
Put the live order book beside your analysis.
Give readers more than a price ticker. Embed a live liquidity heatmap with executed trades and cumulative volume delta, so they can watch how the visible order book changes as price approaches it.
Fills the width of your column at this height.
Order-book heatmap by Basis
<div class="basis-chart-widget" style="width:100%;max-width:100%"> <iframe src="https://www.basischarts.com/embed/chart?symbol=BTCUSDT&view=heatmap" title="BTCUSDT live order-book heatmap chart by Basis" width="100%" height="520" loading="lazy" style="border:0;border-radius:12px;display:block" sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox"></iframe> <p style="margin:6px 0 0;font:12px/1.4 system-ui,sans-serif;color:#7d8998">Live order-book heatmap by <a href="https://www.basischarts.com/" target="_blank" rel="noopener nofollow">Basis</a></p> </div>
Paste the code into any page that accepts HTML. For Notion, paste the link and choose Embed.
From preview to your page
Choose a Binance crypto perpetual pair. The heatmap uses the live futures order book.
Give the widget a wide column and enough height for price, liquidity and CVD. Match the light or dark theme to your site.
Copy the iframe code into your page, then leave the published widget open to observe book history building.
Liquidity heatmap is not liquidation prediction
Heatmap color encodes displayed resting orders in the observed book. Trade bubbles represent executions; liquidation events, when supplied by the venue, are separate. This is not a map of every trader’s future liquidation price or hidden orders.
Book history starts with observation
The widget is not a 24/7 server-recorded order-book archive. It accumulates book observations while running. Opening a fresh page does not retrieve yesterday’s depth, and a connection gap cannot be filled with invented orders. Read the connection and coverage information before comparing time windows.
One venue, not the whole market
This view uses Binance perpetual order-book and trade data. CVD measures aggressive flow in the loaded window, not cash entering the entire crypto market. Compare it with price, timeframe and coverage; a single wall or divergence is not a trading instruction.
Before you embed
Can I embed a free order flow chart on my website?
Yes. Choose the Heatmap view below and copy the generated HTML. No API key is needed. The public heatmap uses Binance crypto perpetuals and keeps Basis branding.
Does the heatmap widget support spot markets?
Not this heatmap. It uses Binance perpetuals. The footprint and volume profile widgets offer supported Binance crypto spot and perpetual markets.
Can I show historical liquidity immediately?
No. Resting-book history builds while the widget is running. Available historical trades are not the same thing as historical order-book depth.
Choose the view. Fit your workflow.
Free footprint chart widget →
Embed bid × ask ladders, delta and imbalances in your own page.
Free volume profile widget →
Give readers session volume, point of control and value-area context.
Crypto chart widgets for WordPress →
Add a responsive trading chart with a Custom HTML block.
Live crypto charts for Notion →
Place an interactive market chart beside your trading journal.