Lightweight
Svelte Gantt Chart

SVAR Gantt is an open-source, easy-to-use Gantt chart component that brings interactive project management features to your Svelte apps.

Also available for:

previewpreview

Why Choose SVAR Svelte Gantt?

Written in Svelte

With Svelte at its core, SVAR Gantt chart lets you quickly build a responsive and high-performance project visualization with minimal efforts. As a client-side solution, it can be used with any backend.

Easy to customize

SVAR Gantt offers a rich intuitive API and flexible CSS styling. Use these features to adjust the look and feel of the Gantt chart: task bars, rows and columns on the timeline, task edit form, and more.

Interactive and user-friendly

Enjoy a wide range of interactive features: reorder tasks in the grid and edit tasks on chart with drag-and-drop, zoom the chart, show tooltips for task details and easily manage tasks with toolbar or context menu.

Optimized for large datasets

Maintain high quality performance due to an optimized rendering engine and dynamic loading. Our Svelte Gantt chart ensures fast loading speed even with large volumes of data.

Responsive and reliable

SVAR Svelte Gantt is highly responsive, ensuring seamless functionality across various screen sizes and devices. It also guarantees stable performance on desktops and touch screens.

Quick to start with

With well crafted documentation, comprehensive API references, and detailed how-to guides, adding a Gantt chart onto your webpage takes mere minutes.

Svelte Gantt Chart Live Demo

Svelte Gantt Chart Demo Preview

For the best experience, view this page on a desktop device to enjoy the live demo, as it looks great on larger screens!

Core Features of SVAR Svelte Gantt

Intuitive task editing

Users can modify tasks on the timeline with a simple drag-and-drop feature: resize and drag the taskbars on the timeline or reorder tasks in the grid. Also, the intuitive edit form can be activated by double-clicking the task bar or task row in the grid. You can customize the form to suit your project's specific needs.

Intuitive task editing

Task dependencies

Create task relationships and build hierarchical structures with summary tasks and sub-tasks. Define dependencies directly on the timeline or through the edit form to represent project workflows accurately.

Task dependencies

Localization

The localization feature allows you to present the interface of the Gantt chart in the language you'd like. You can provide custom translations for actions (edit, delete), button labels, confirmation messages, task edit form fields and context menu items.

Localization

Handy toolbar and context menu

Effortlessly manage tasks with the intuitive toolbar. Add, delete, rearrange, and edit tasks with ease using toolbar buttons for moving tasks up/down, indent/outdent, copy/cut/paste features, or add your custom operations. You can also enable a context menu to stay in control of your project's timeline and structure.

Handy toolbar and context menu

Customizable appearance

SVAR Gantt chart comes with light and dark skins. You also have the freedom to tailor the look of task bars and assign them to different task types (e.g. show urgent tasks in red color). The timeline grid can be also easily modified (cell size, borders) to match your app's design.

Customizable appearance