Search nx-ui

Jump to any foundation, component, block or example.

Overview
  • Home
  • Components
  • Documentation
  • Brand icons
  • Colours
  • Icons
  • Shadows
  • Theme matrix
  • Typography
  • Invoices
  • Waste movements
  • Organisations
  • Area
  • Bar
  • Composed
  • Donut & pie
  • Interactive
  • Line
  • Radial & gauge
  • Sparklines
  • Chain Of Custody
  • Compliance Checklist
  • Ewc Badge
  • Ewc Selector
  • Haulage Vehicle Select
  • Location Selector
  • Mass Input
  • Material Selector
  • Movement Form
  • Movement Status Badge
  • Movement Timeline
  • Opportunities
  • Pdf TemplatesNew
  • Permit Badge
  • Project Scope Selector
  • Stockpile Visualiser
  • Transfer Document
  • Transfer Note
  • Control Room
  • Dashboard
  • Empty states
  • Forgot password
  • Maintenance
  • Marketplace
  • Movement detail
  • Movements
  • 404 — Not found
  • Onboarding wizard
  • Opportunities
  • Scoped app
  • 500 — Server error
  • Settings — Billing
  • Settings — Profile
  • Settings — Team
  • Sign in
  • Sign up
  • Backdrop
  • Background Patterns
  • Cta Banner
  • Faq
  • Feature Card
  • Feature Row
  • Grid Backdrop
  • Hero Split
  • How It Works
  • Logo Cloud
  • Motion
  • Page Hero
  • Section
  • Site Footer
  • Site Header
  • Stats Band
  • Testimonials
  • Artifact
  • Chain of Thought
  • Chat
  • Checkpoint
  • Code Block
  • Confirmation
  • Context
  • Conversation
  • Image
  • Inline Citation
  • Loader
  • Message
  • Model Selector
  • Open in Chat
  • Plan
  • Prompt Input
  • Queue
  • Reasoning
  • Shimmer
  • Sources
  • Task
  • Tool
  • Web Preview
  • Workflow
  • Boundary Map
  • Camera & Tours
  • Globe
  • Isochrones
  • Map Marker
  • Map Stat Overlay
  • Map Toolbar
  • Map View
  • Route Map
  • Routing
  • Site Map
  • 3D Terrain
  • Tilted Routes
  • Transfer Preview
  • Listing Card
  • Listings Filters
  • Listings Panel
  • Marketplace Map
  • Price Range
  • App-shell pattern
  • Components & blocks
  • Contributing
  • Getting started
  • Theming
  1. Home
  2. Charts

Charts

Recharts examples built on the nx-ui chart tokens: line, area, bar, donut, radial, sparkline, composed and interactive charts — each wired through the ui/chart ChartContainer for themed colours, dark tooltips and legends.

Area
Stacked areas with gradient fills for cumulative trends.
Bar
Grouped, stacked and negative-value bar charts.
Composed
A composed bar-plus-line chart with dual axes.
Donut & pie
Donut charts with a centre KPI, plus a labelled pie.
Interactive
Brush-to-zoom and time-range toggling.
Line
Multi-series line charts with reference lines and a dotted target.
Radial & gauge
Radial progress rings and a half-circle gauge.
Sparklines
KPI cards with inline trend sparklines.