How do I embed a chart in a Webflow site?
Quick answer
Embed a chart in Webflow by adding an 'Embed' element in the designer and pasting the iframe code. Style the container with Webflow's visual controls for responsive sizing. This is ideal for fund factsheets, IR pages, and fintech product pages where interactive financial charts need to look native to the site design.
Webflow for fintech and finance sites
Webflow is the tool of choice for fintech marketing sites, fund manager websites, and IR (investor relations) pages. Its visual editor gives design teams full control over layout without writing code, while still producing clean, performant HTML.
For these sites, interactive financial charts are a key differentiator. A fund factsheet with live, explorable charts is far more compelling than one with static PNGs.
How to embed Quadesto charts in Webflow
1. Create your visualization in Quadesto — yield curve, portfolio performance, risk metrics, or any of the 30+ chart types.
2. Click 'Share' and copy the embed code (iframe snippet).
3. In Webflow's designer, add an 'Embed' element where you want the chart.
4. Paste the iframe code.
5. Style the embed container using Webflow's visual controls — set width, height, margins, and responsive behavior.
The chart renders in both the Webflow designer preview and the published site.
Real-world examples
Fund factsheets
An asset manager builds their client-facing factsheet page in Webflow. They embed live charts from Quadesto showing fund performance, attribution, risk metrics, and benchmark comparisons. When monthly data updates, the charts refresh automatically.
IR pages
A public company's investor relations page embeds share price charts, financial metrics, and sector comparisons from Quadesto. Interactive charts let investors explore the data rather than downloading PDFs.
Fintech product pages
A fintech startup uses Webflow for their marketing site. They embed live demo charts from Quadesto to show potential customers what their product's data looks like when visualized. No fake mockups — real interactive charts with real data.
Responsive considerations
Webflow gives you full control over responsive behavior. For Quadesto embeds:
Use percentage-based width (100% or a max-width) so charts fill their container on all screen sizes.
Set a fixed height (400-600px) or use Webflow's aspect ratio controls.
Quadesto's ECharts-based renderer handles resize events automatically, so charts adapt cleanly to any container size.