April Savings -  20% Off All Froala Plans
Days
Hours
Minutes
Seconds
x

Froala Editor v4.2.0 is Here LEARN MORE

Pricing
Get Started
Skip to content

Try Froala Charts

Start your trial today and receive 7 days of FREE technical support to get you started.

Here are some benefits you’ll get from using
Froala Charts Trial:

  • 7 days of FREE Technical Support
  • Access to the Full Suite of Interactive Charts and Demos
  • Access to All Features & Customizations
  • Documentation & Demo Examples
Fill out the form to download a free trial of Froala Charts.

All fields are required

Thousands have chosen Froala.

I just want to complement you all with an excellent piece of code! There are plenty free Froala Charts around, but I just love Froala! It is easy to implement, has enough features, well coded and updated when needed. Good job you all!

— Dave Reedijk

We love all the recent updates. One of our customer JUST ASKED about a video upload option and we look like rockstars 🙂 Amazing work!
Your happy customer,

— Marybeth Alexander, CEO at KnowledgeOwl

See More

Samsung Apple IBM Amazon Ebay Intel Netflix Cisco Thomson Reuters

Froala Charts Installation Instructions

Please read the License Agreement before using our rich text editor.

Subscribe to receive email notifications about new features and new releases for the Froala Charts Editor.

The ZIP archive contains the minified source code for Froala Charts. Unzip the package and take a look over the Get Started Guide to create your first working chart.

The ZIP archive for the latest version (1.0.0) of the Froala Charts can be downloaded using the button at the top of the page. Please check out our changelog for more details.

Instead of downloading the editor you can use CDN to access the files directly. All files from our Get Started Guide are available on CDN and you can link to them like in the example below: 
<head>
<script type='text/javascript' src='https://cdn.jsdelivr.net/npm/[email protected]/froalacharts.js'></script>
<script type='text/javascript' src='https://cdn.jsdelivr.net/npm/[email protected]/themes/froalacharts.theme.froala.js'></script>
</head>
Froala Charts is also available via UNPKG.

Our interactive charts come with NPM packages for multiple front-end frameworks. Here is an example of NPM usage:

npm i froalacharts

Froala Charts can also be installed by using Yarn as showed in the example below:

yarn add froalacharts

See changelog to keep track of what’s new in the current version.

Froala Charts has plugins for the most popular development libraries and frameworks.

[class^="wpforms-"]
[class^="wpforms-"]
[bws_google_captcha]
<div class="gglcptch gglcptch_v2"><div id="gglcptch_recaptcha_1125360080" class="gglcptch_recaptcha"></div> <noscript> <div style="width: 302px;"> <div style="width: 302px; height: 422px; position: relative;"> <div style="width: 302px; height: 422px; position: absolute;"> <iframe src="https://www.google.com/recaptcha/api/fallback?k=6Ld6lNoUAAAAAM626LfCOrnkBFJtYZAKESFCjgv_" frameborder="0" scrolling="no" style="width: 302px; height:422px; border-style: none;"></iframe> </div> </div> <div style="border-style: none; bottom: 12px; left: 25px; margin: 0px; padding: 0px; right: 25px; background: #f9f9f9; border: 1px solid #c1c1c1; border-radius: 3px; height: 60px; width: 300px;"> <textarea id="g-recaptcha-response" name="g-recaptcha-response" class="g-recaptcha-response" style="width: 250px !important; height: 40px !important; border: 1px solid #c1c1c1 !important; margin: 10px 25px !important; padding: 0px !important; resize: none !important;"></textarea> </div> </div> </noscript></div>
[class^="wpforms-"]
[class^="wpforms-"]
[bws_google_captcha]
<div class="gglcptch gglcptch_v2"><div id="gglcptch_recaptcha_134264251" class="gglcptch_recaptcha"></div> <noscript> <div style="width: 302px;"> <div style="width: 302px; height: 422px; position: relative;"> <div style="width: 302px; height: 422px; position: absolute;"> <iframe src="https://www.google.com/recaptcha/api/fallback?k=6Ld6lNoUAAAAAM626LfCOrnkBFJtYZAKESFCjgv_" frameborder="0" scrolling="no" style="width: 302px; height:422px; border-style: none;"></iframe> </div> </div> <div style="border-style: none; bottom: 12px; left: 25px; margin: 0px; padding: 0px; right: 25px; background: #f9f9f9; border: 1px solid #c1c1c1; border-radius: 3px; height: 60px; width: 300px;"> <textarea id="g-recaptcha-response" name="g-recaptcha-response" class="g-recaptcha-response" style="width: 250px !important; height: 40px !important; border: 1px solid #c1c1c1 !important; margin: 10px 25px !important; padding: 0px !important; resize: none !important;"></textarea> </div> </div> </noscript></div>
[class^="wpforms-"]
[class^="wpforms-"]
[bws_google_captcha]
<div class="gglcptch gglcptch_v2"><div id="gglcptch_recaptcha_1068479885" class="gglcptch_recaptcha"></div> <noscript> <div style="width: 302px;"> <div style="width: 302px; height: 422px; position: relative;"> <div style="width: 302px; height: 422px; position: absolute;"> <iframe src="https://www.google.com/recaptcha/api/fallback?k=6Ld6lNoUAAAAAM626LfCOrnkBFJtYZAKESFCjgv_" frameborder="0" scrolling="no" style="width: 302px; height:422px; border-style: none;"></iframe> </div> </div> <div style="border-style: none; bottom: 12px; left: 25px; margin: 0px; padding: 0px; right: 25px; background: #f9f9f9; border: 1px solid #c1c1c1; border-radius: 3px; height: 60px; width: 300px;"> <textarea id="g-recaptcha-response" name="g-recaptcha-response" class="g-recaptcha-response" style="width: 250px !important; height: 40px !important; border: 1px solid #c1c1c1 !important; margin: 10px 25px !important; padding: 0px !important; resize: none !important;"></textarea> </div> </div> </noscript></div>