Lightweight Svelte Gantt Chart
SVAR Svelte Gantt is an open-source, customizable Gantt chart component written in Svelte. Build custom project timelines and task flow visualizations in minutes!
Also available for:
SVAR Svelte Gantt is an open-source, customizable Gantt chart component written in Svelte. Build custom project timelines and task flow visualizations in minutes!
With Svelte at its core, SVAR Gantt chart lets you quickly build a modern, interactive project visualization UI with minimal effort. As a client-side Svelte solution, it can be used with any JavaScript-based stack and with any backend. It's also Svelte 5 ready!
SVAR Gantt offers a rich intuitive API and flexible CSS styling. Use these features to adjust the look and feel of the Gantt chart: time scale, task bars, task grid columns, task edit form, and more.
Maintain high-quality performance due to an optimized rendering engine and dynamic loading. This Svelte Gantt chart ensures incredibly fast loading speed even with big data - see the demo with 10k tasks.
SVAR Svelte Gantt works with any backend through the RestDataProvider service. It automatically handles all CRUD operations for tasks and links with debouncing, and supports batch processing for performance optimization.
Our Svelte Gantt chart comes with drag and drop support, proving the interactivity users are used to in modern apps. Users can reorder tasks in the grid, move and resize task bars on the chart, and drag task progress on a task bar.
With well-crafted documentation, comprehensive API references, detailed how-to guides, and multiple demos you can quickly add our Svelte Gantt chart for project scheduling to a web app.
Explore SVAR Svelte Gantt: move and resize taskbars, double-click a taskbar to call the editing 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!
SVAR Svelte Editor can be easily integrated into the Gantt chart, giving end users the ability to add and edit tasks via an intuitive form. You can customize the form to suit your project's needs: define custom fields, add validation rules, choose modal or sidebar display, and adjust saving behavior.
SVAR Gantt supports 3 task types (tasks, summary tasks and milestones) and displays task dependencies, such as predecessor-successor relationships, to accurately represent project timelines. You can also create hierarchical project structures with subtasks for complex project visualization.
Give your users a way to effortlessly manage tasks with the intuitive toolbar: add, delete, rearrange, and edit tasks with ease using toolbar buttons, or add your custom operations. You can also enable a context menu that helps users easily control the project's timeline and structure.
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.
SVAR Svelte Gantt offers a beautifully-designed user interface with both light and dark themes. Users benefit from interactive tooltips with additional info for each task, zooming feature, and keyboard shortcuts for quick navigation. A highly flexible task grid supports multi-column task sorting, in-cell task editing, custom HTML content, and a header menu that allows users to show or hide grid columns.
A customizable, reusable Svelte component that provides an interactive Gantt chart for managing tasks, timelines, and dependencies. Key features include drag-and-drop task management, task dependencies, customizable edit form, tooltips, flexible time scales, and CSS styling options. The component is compatible with the latest Svelte 5.
SVAR Svelte Gantt is open-source and available under the GPLv3 license. It can be freely used in open-source projects, with commercial licensing available. Note that GPLv3 requires that if you distribute a modified or integrated version of SVAR Svelte Gantt within your project, your project must also be open-sourced under a GPLv3-compatible license. For closed-source use, you'll need a commercial license (contact us for the details).
It's a Svelte-native Gantt chart component designed for both speed and easy customization. Thanks to its 100% Svelte code, it's highly responsive, easy to style, and integrates naturally with Svelte apps. It's also optimized to render large datasets with smooth performance. SVAR Svelte Gantt provides advanced features required for modern apps: rich customization options, easy styling with CSS, and drag-and-drop support for adjusting start dates, durations, and dependencies directly on the chart.
TypeScript support is not available yet, but we're working on it and it's planned for an upcoming release.
npm install wx-svelte-gantt Yes, we provide a complete Go backend example on GitHub, plus RestDataProvider for easy server integration with any backend.
Yes, if we're talking about Svelte components, SVAR Gantt is a great choice: written in Svelte (no wrappers), open-source, feature-rich, and tailored for building project management, task tracking, and scheduling apps.
