Nivo

Name: Nivo
Author: plouc

by ploucTypeScript

Rich set of dataviz components built on D3 and React.

Repositoryexperimental

Maturity: experimental because latest release v0.99.0 is pre 1.0. Derived from release and commit history, not a rating.

Stars: 14k
Forks: 1.1k
Downloads / mo: —
Last commit: 2026-07-21
License: MIT
Open issues: 48

Market and trust evidence

Edition not yet matched

No exact skills.sh identity match is available for this repository. Repository adoption and freshness remain visible above; install momentum is not inferred.

Trust analysis is a screening signal, not a security warranty. Read the ranking and trust methodology.

In practice

Written by AI from this repository’s README · medium confidence

Wiring d3 into React by hand means imperative DOM code and charts that cannot be server side rendered.

Use it when

When you want declarative React chart components with theming, transitions and server side rendering.

Not the right pick when

Wrong pick outside React, and every chart family needs its own scoped @nivo package alongside @nivo/core.

Capabilities

supercharged React components built on top of d3
SVG, HTML and canvas chart variants
server side rendering and an HTTP API
motion and transitions powered by react-spring
patterns, gradients and theming guides
responsive charts

Requirements

@nivo/core plus a scoped @nivo package per chart type

Cost: Free and open source

Compare Repository ↗Homepage ↗

Video walkthroughs

Step by Step guide to implementing Nivo graphs into CoreUI react template

650 AI Lab · 8K views · ≈Aug 2022

Third-party YouTube uploads matched to this tool by title, channel and repository name on 2026-08-03. Not made, reviewed or endorsed by SkillPilot. View counts and publish months are as of the match date and the month is approximate. Nothing loads from YouTube until you press play.

What the repository ships

Has examplesCI configured

Detected from the actual files in the repository root.

Latest release v0.99.0

Published 2025-05-23

What's Changed

@nivo/bar adjustments, website controls improvements, new scales guide... by @plouc in https://github.com/plouc/nivo/pull/2764

Full Changelog: https://github.com/plouc/nivo/compare/v0.98.0...v0.99.0

README

Backers on Open Collective

Sponsors on Open Collective

[![License][license-image]][license-url]

[![GitHub Actions][actions-image]][actions-url]

[![NPM version][npm-image]][npm-url]

nivo channel on discord

nivo provides supercharged React components to easily build dataviz apps,

it's built on top of d3.

Several libraries already exist for React d3 integration,

but just a few provide server side rendering ability and fully declarative charts.

Installation

In order to use nivo, you have to install the @nivo/core package and then choose

some of the scoped @nivo packages according to the charts you wish to use:


yarn add @nivo/core @nivo/bar

Features

Highly Customizable
Motion/Transitions, powered by react-spring
Interactive Components Playground
Exhaustive Documentation
SVG Charts
HTML Charts
Canvas Charts
Server Side Rendering and HTTP API
Patterns & Gradients
Theming
Responsive Charts

Discussion

Join the nivo discord community.

Packages & components

nivo is comprised of several packages/components, for a full list,

please use the Components Explorer.

Guides

Backers

Donations are welcome to help improving nivo [Become a backer]

Open Collective Sponsors

Support this project by becoming a sponsor,

your logo will show up here with a link to your website. [Become a sponsor]

[license-image]: https://img.shields.io/github/license/plouc/nivo.svg?style=flat-square

[license-url]: https://github.com/plouc/nivo/blob/master/LICENSE.md

[npm-image]: https://img.shields.io/npm/v/@nivo/core.svg?style=flat-square

[npm-url]: https://www.npmjs.com/~nivo

[actions-image]: https://img.shields.io/github/actions/workflow/status/plouc/nivo/ci.yml?branch=master&style=flat-square

[actions-url]: https://github.com/plouc/nivo/actions

[prettier-image]: https://img.shields.io/badge/styled_with-prettier-ff69b4.svg?style=flat-square

[prettier-url]: https://github.com/prettier/prettier