Charts.css: CSS Chart & Graph Framework Examples
A CSS data visualization framework that turns regular HTML tables into beautiful and customizable charts.
Bar Chart
Bar Chart
| $40K More info... |
| $60K More info... |
| $75K More info... |
| $90K More info... |
| $100K More info... |
Column Chart
Labels Example #4 | Day | Forecast |
Mon
| 28° |
| Tue | 25° |
| Wed | 23° |
| Thu | 16° |
| Fri | 14° |
| Sat | 18° |
| Sun | 22° |
|---|
Area Chart
Area Example #6 | Year | Progress 1 | Progress 2 | Progress 3 |
| 2000 | 50 | 20 | 40 |
| 2010 | 80 | 50 | 10 |
| 2020 | 40 | 30 | 20 |
|---|
Line Chart
Line Example #13 | Year | Progress 1 | Progress 2 | Progress 3 |
| 2000 | 50 | 20 | 40 |
| 2010 | 80 | 50 | 10 |
| 2020 | 40 | 30 | 20 |
|---|
Stacked Bars
Percentage Stacked Bars | Continent | #1 | #2 | #3 | #4 |
| America | 50$ | 50$ | 30$ | 20$ |
| Asia | 30$ | 30$ | 30$ | 30$ |
| Europe | 40$ | 25$ | 45$ | 30$ |
| Africa | 20$ | 20$ | 20$ | 20$ |
|---|
Multiple Datasets
Front End Developer Salary | Asia | $20K | $30K | $40K | $50K | $75K |
| Europe | $40K | $60K | $75K | $90K | $100K |
|---|
- 1st year
- 2nd year
- 3rd year
- 4th year
- 5th year
Custom Styles
3D Effect Example #1 | Year | Progress |
| 2016 | 20 |
| 2017 | 40 |
| 2018 | 60 |
| 2019 | 80 |
| 2020 | 100 |
|---|