GitPedia

KLineChart

📈Lightweight k-line chart that can be highly customized. Zero dependencies. Support mobile.(可高度自定义的轻量级k线图,无第三方依赖,支持移动端)

From klinecharts·Updated June 18, 2026·View on GitHub·

**KLineChart** is a 📈Lightweight k-line chart that can be highly customized. Zero dependencies. Support mobile.(可高度自定义的轻量级k线图,无第三方依赖,支持移动端) The project is written primarily in TypeScript, distributed under the Apache License 2.0 license, first published in 2019. It has gained significant community traction with 3,871 stars and 948 forks on GitHub. Key topics include: candlestick, canvas, chart, exchange, finance.

Latest release: v10.0.0-beta3Version 10.0.0-beta3
June 3, 2026View Changelog →
<div align="center"> <a href="https://klinecharts.com"> <img src="https://klinecharts.com/images/logo.svg?hash=89987fs7789" height="100"/> </a> </div> <h1 align="center">KLineChart</h1> <div align="center"> English | <a href="https://github.com/liihuu/KLineChart/blob/main/README.zh-CN.md">简体中文</a> </div> <br/> <p align="center">💹📈 Lightweight k-line chart built with html5 canvas.</p> <div align="center">

GitHub Workflow Status (with branch)
Version
Size
npms.io (maintenance)
Typescript
LICENSE
Docs

</div> <div align="center">

Issues
Discussions
Telegram
Wechat

<!-- [![Discord](https://img.shields.io/static/v1?color=738BD8&logo=discord&logoColor=fff&label&message=Discord)](https://discord.gg/7YjHYgvvvZ) --> <!-- [![Twitter](https://img.shields.io/static/v1?color=1D9BF0&logo=twitter&logoColor=fff&label&message=Twitter)](https://twitter.com/klinecharts) --> </div> <img style="margin-bottom:6px" src="https://cdn.nlark.com/yuque/0/2023/png/8403091/1684399506365-assets/web-upload/044fe897-168c-4fbb-a485-87a8ef61c04a.png" />

✨ Features

  • 📦 Out of the box: Simple and fast integration, basically zero cost to get started.
  • 🚀 Lightweight and smooth: Zero dependencies, only 40k under gzip compression.
  • 💪 Powerful functions: Built-in multiple indicators and line drawing models.
  • 🎨 Highly scalable: With rich style configuration and API, the function can be extended as you like.
  • 📱 Mobile: Support mobile, one chart, handle multiple terminals.
  • 🛡 Typescript development: Provide complete type definition files.

📦 Install

Using npm

bash
npm install klinecharts --save

Using yarn

bash
yarn add klinecharts

CDNs

unpkg

html
<script type="text/javascript" src="https://unpkg.com/klinecharts/dist/klinecharts.min.js"></script>

jsDelivr

html
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/klinecharts/dist/klinecharts.min.js"></script>

📄 Docs

Online

https://www.klinecharts.com

Locale

Execute command in root directory. Node.js is required.

bash
# Install the dependencies npm install # Start document service npm run docs:dev

After successful startup, open in the browser http://localhost:8888 .

🛠️ Build

Execute command in root directory. Node.js is required.

bash
# Install the dependencies npm install # Build files npm run build

The generated files are in the dist folder.

©️ License

KLineChart is available under the Apache License V2.

Contributors

Showing top 12 contributors by commit count.

View all contributors on GitHub →

This article is auto-generated from klinecharts/KLineChart via the GitHub API.Last fetched: 6/18/2026