Customizable React Gantt Chart

SVAR Gantt helps you integrate a powerful Gantt chart into your web app in minutes. TypeScript-friendly, React 19 compatible, with an MCP server for AI-assisted development.

Also available for:

Why Use SVAR React Gantt Chart?

100% React solution

SVAR Gantt is built entirely with React and integrates seamlessly with any backend. Build modern, high-performance timelines and project schedules using familiar React patterns.

Quick start & AI-assisted development

Get up and running with SVAR React Gantt using well-structured documentation, detailed API references, and a wide range of demos. We also provide an MCP server that connects your AI-coding assistant to the up-to-date SVAR Gantt knowledge base.

Customizable and flexible

Easily adjust the Gantt chart to your needs: from time scales and task bars to a task edit form, grid columns, and beyond. SVAR Gantt offers rich customization capabilities provided by a clear API and flexible CSS styling options.

Interactive user interface

Our React Gantt component comes with an intuitive drag-and-drop UI. Users can change task start and end dates, adjust durations directly on the timeline, add or remove dependencies, and open the task editor with a double-click.

Lightning-fast

With an optimized rendering engine and dynamic loading, SVAR React Gantt handles large datasets smoothly, delivering consistent performance even with complex timelines and thousands of tasks - see the demo with 10k tasks.

Open-Source & PRO Editions

SVAR React Gantt is available as a free open-source solution under the MIT license. For more complex scheduling scenarios, we also offer a PRO Edition.

Advanced features such as working-day calendars, baselines, auto-scheduling, split tasks, and undo/redo are available in SVAR Gantt PRO, adding powerful scheduling logic to your applications.

Star on GitHub

Try React Gantt in Action

Explore the interactive UI of SVAR React Gantt chart: move and resize taskbars, double-click a taskbar to call the edit form, reorder the items in the grid on the left, or use the toolbar to manage the tasks. For the best experience, view this page on a desktop device to enjoy the live demo, as it looks great on larger screens!

PRO Edition to Power Up Your React Gantt

SVAR Gantt PRO extends our core React Gantt component with features commonly required in more complex, enterprise-level applications.

pro

Calendar-aware scheduling

React Gantt PRO supports non-linear time scales that respect working days, weekends, and holidays. Task durations are calculated using real calendars, helping you build more accurate schedules without manual date adjustments.

pro

Critical path and baselines

Critical path highlights the sequence of tasks that influence the project deadline, making it easier to spot risks and bottlenecks. The baselines feature allows you to compare planned vs actual timelines directly on the chart.

pro

Timeline markers

Add visual markers to highlight important dates such as milestones, releases, or deadlines. Markers make key events immediately visible on the timeline and help teams stay aligned on critical moments.

pro

Split tasks

React Gantt PRO allows a single task to be split into multiple segments on the same row. This is useful for representing pauses, interruptions, or phased work on a single row.

pro

Automatic scheduling

The PRO Edition includes built-in auto-scheduling for forward planning with Finish-to-Start (FS) dependencies. When task dependencies change, the schedule is recalculated automatically to preserve logical sequencing. As a result, moving a predecessor task automatically shifts dependent tasks, keeping the timeline consistent.

Get Free Trial

Fill out the form to receive a free 30-day trial of SVAR React Gantt PRO. Once we receive your request, we'll send you detailed instructions on how to access the trial version.

  • Fully functional trial
  • 30-day trial period
  • SVAR watermark

Read the full Trial License Agreement

Latest Updates

Version 2.4

December 22, 2025

What's new

Delete dependencies on timeline

Auto-scheduling (PRO)

Markers (PRO)

Split tasks (PRO)

Version 2.3

October 22, 2025

What's new

TypeScript support

React 19 compatibility

Flexible time scale

Custom time units

Version 1.3

January 18, 2025

What's new

Task sorting in grid

Batch updates support

Flexible zooming

Summary tasks

Need help with integration?

Our team offers paid consulting and custom development services to help you make the most of SVAR React Gantt, from setup and feature customization to full web app development for your business needs.

Frequently Asked Questions

SVAR React Gantt is fully compatible with React 18 and 19.
Yes, TypeScript definitions have been available since version 2.3. You can fully leverage type safety when integrating SVAR Gantt into your React projects.
You can easily integrate a React Gantt Chart component by installing it via npm:
  • Install the open-source version: npm install @svar-ui/react-gantt
  • Import into your React app
  • Initialize the Gantt with its main configuration options
  • Load task and dependency data
  • Configure and customize the Gantt chart to your needs
SVAR React Gantt component integrates seamlessly with Redux, REST APIs, and modern React workflows - perfect for dashboards, project planning tools, and agile management. Helpful resources: To try SVAR Gantt PRO with additional features, fill in this form for a free 30-day trial.
SVAR React Gantt comes in two editions:
  • Open-source (MIT license) - Free to use in both open-source and commercial projects. Includes all core Gantt functionality: interactive timeline, drag-and-drop task management, dependencies, customizable grid columns, and more.
  • PRO Edition (commercial licenses) - Adds advanced scheduling features for enterprise-level project planning: markers, baselines, unscheduled tasks, working days calendar, auto-scheduling, and more.
Compare editions and see prices →
SVAR React Gantt provides a strong balance between flexibility and performance. The open-source edition covers core Gantt functionality, while remaining lightweight and easy to customize. It is well suited for developers who need a React-native (no wrappers) Gantt component for product planning, sprint tracking, project timelines, or internal management tools.
Yes. The component works well with Redux and other state management solutions. This makes it suitable for complex applications that require centralized control over tasks, dependencies, and project state.
SVAR provides a complete Go backend example along with a RestDataProvider helper for easier server-side integration. This allows you to load and update tasks dynamically, synchronize project data, and build collaborative workflows.
Yes. SVAR React Gantt is optimized for dashboards, sprint planning, milestone tracking, and agile project management. Features such as zoomable timelines, drag-and-drop task editing, keyboard support, localization, and REST API integration make it practical for managing multiple projects in modern React applications.

Resources