Note! You are currently looking at a fork of the original Tremor project. This fork carries a patch to support multiple y axes and will be maintained until it (or a similar patch) hopefully lands upstream. Use at your own risk.
Tremor provides React components to build charts and dashboards. Fully open-source, made by data scientists and software engineers with a sweet spot for design.
See our Installation Guide. To make use of the library we also need Tailwind CSS setup in the project.
With Tremor creating an analytical interface is easy.
//Card.tsx
import { Card, ProgressBar } from "@tremor/react";
export default () => (
<Card className="max-w-sm">
<span className="text-tremor-default text-tremor-content">Sales</span>
<p className="text-tremor-metric text-tremor-content-strong font-semibold">$71,465</p>
<div className="flex items-center justify-between">
<span className="text-tremor-default text-tremor-content">32% of annual target</span>
<span className="text-tremor-default text-tremor-content">$ 225,000</span>
</div>
<ProgressBar value={32} className="mt-2" />
</Card>
);
We are always looking for new ideas or other ways to improve Tremor. If you have developed anything cool or found a bug, send us a pull request. Check out our Contributor License Agreement here.
Copyright © 2024 Tremor. All rights reserved.