---
title: "WF Charts Lite — Free Framer component · Best of Framer"
description: "Free Framer component · by Tobias Haugen · Charts. A simple, flexible and powerful chart component for Framer that gives you full control over your data and presentation."
canonical: "https://framer.elliotli.dev/component/wf-charts-lite"
---

[Home](/)/[Components](/components)/[Charts](/components/category/charts)/WF Charts Lite

# WF Charts Lite

[View on Framer](https://framer.com/marketplace/components/wf-charts-lite/?via=elliot-li)

![WF Charts Lite preview image 1](https://framer.elliotli.dev/og/component/wf-charts-lite/e1ecd0733fa50028/1600x1200.jpg)

## Summary

A simple, flexible and powerful chart component for Framer that gives you full control over your data and presentation.

## Description

A simple, flexible and powerful chart component for Framer that gives you **full control over your data and presentation**. Bring your own data as JSON, map the fields you want to use, and customize the chart to match your design system or layout.

### Supported chart types

The component supports both **Bar Charts** and **Line Charts**.

### Bring your own data

Paste your own JSON data to be used in the chart, or use **fetch** to use an external data source. Then manually map the data to be used in the X and Y axis. **You** are in control of the data, and how it's displayed

### Customization

Multiple options to customize the charts are available, giving you the flexibility to style the charts to fit your theme:

-   Custom colors for each bar/line
    
-   Hide/Show X-axis labels
    
-   Hide/Show Y-axis labels
    
-   Hide/Show Legend labels
    
-   Hide/Show vertical grid line
    
-   Stack multiple bars into one (Bar Charts only)
    
-   Set stroke width (Line Charts only)
    

### Support & feedback

This component is **actively supported**.

If you run into issues, have questions, or want to suggest new features, join the Discord: [https://discord.gg/S6sQ9p36](https://discord.gg/S6sQ9p36)

## Rank history [How rankings work →](/terms#rankings)

-   All · #3246

## Details

- **Author**: Tobias Haugen
- **Published**: 2026-01-19
- **Updated**: 2026-01-19
- **Added**: 2026-01-04
- **Categories**: Charts

## More like this

-   [29 Radar Chart](/component/29-radar-chart) — BrandingUp · Free — Spider chart with per-axis scales
-   [33 Bubble Chart](/component/33-bubble-chart) — BrandingUp · Free — Bubble chart with 3rd-value sizes
-   [Pricing Matrix](/component/pricing-matrix) — Ainsley Holmes · Free — Currency Payment Comparison Matrix
-   [Radial Dial](/component/radial-dial) — Oli Studio · $10 — Animated dial for a single metric