Getting started

Welcome to our TradingView Widgets documentation.

This documentation will guide you on integrating our financial widgets into your website. You will learn how to customize the widgets, implement and use them effectively for top-notch financial visualization.

What are widgets

TradingView Widgets are ready-to-use financial tools you can embed into your website to display market data.

Widgets are perfect for finance blogs, trading platforms, portfolio trackers, or any website that wants to share financial insights with users. With just a few lines of code, you can display interactive charts, live tickers, economic calendars, watchlists, and more.

How widgets work

Each widget is available as a lightweight HTML snippet or a React component, so you can easily integrate it into any website or app. Widgets come with built-in data provided by TradingView, so there’s no need to connect your own data sources or APIs. All you do is just:

  1. Pick a widget.
  2. Customize it in the constructor.
  3. Copy and paste the auto-generated embed code into your website.

That’s it — the widget appears instantly!

Also, each widget is fully responsive and designed with accessibility in mind, making it easy to deliver a seamless experience across devices and assistive technologies.

Widget formats

TradingView widgets are available in two variations: iframe and Web Component. The difference is purely technical. Both formats display the exact same high-quality market data, charts, and designs. However, they differ in how they are embedded, customized, and loaded inside your website code.

  • Web Component: This is a newer, more modern technology. You can identify these widgets by the embed code, which uses tags that start with tv- (for example, <tv-mini-ticker-chart>).
  • Iframe: This is the classic embedding method used across the web. The embed code for these will rely on standard <script> tags.

When you browse the widgets collection, each page will clearly indicate which format is being used so you know what to expect when you copy the code. If you want to dive deeper into the technical differences, read a Widget formats guide.

Where to start

Follow step-by-step tutorials

New to TradingView Widgets? Start here. Whether you choose the classic iframe or the new Web Component format, we have hands-on guides for you. Visit our tutorials section to learn how to customize and embed widgets to build a complete financial web page.

Explore available widgets

Access the directory of all our widgets, customize them, and generate the embed code for your website. Here, you can also find some example configurations of the widgets for efficient usage.

Explore available markets

Browse the full list of all available markets and their data level provided for our widgets. This can range from real-time data, delayed data, to end of day data.

See widgets in action

Get inspired by live examples of mock websites that show how different widgets work together, creating holistic financial data dashboard sites. You can explore examples like Stocks, Forex, and Crypto to have a better understanding.

Find quick answers

Got questions? We’ve gathered answers to the most common ones — from troubleshooting widget issues to understanding customization options.

More from TradingView

We’re not just about widgets. TradingView offers a suite of other products to fuel your financial ambitions.

  • Explore Lightweight Charts™, our open-source, nimble charting solution designed for developers.
  • If you’re looking for a comprehensive charting solution with all the bells and whistles, our Charting Libraries have got you covered.

Just remember, with these products, you’ll need to provide your own data. Widgets, on the other hand, come with built-in data provided by TradingView.