SvGrid - the Svelte 5 data grid

SvGrid is a modern data grid for Svelte 5: a headless engine you can compose plus a full-featured render component you can drop in. Sorting, filtering, grouping, virtualization, inline editing, server-side data, and 120+ production-quality examples. Free under the MIT License; sv-grid-pro adds export, print, pivot, and AI helpers.

Features

• Headless engine plus a drop-in <SvGrid> render component
• Sorting, Excel-style filters, grouping, aggregation, tree, and master/detail
• Row + column virtualization - 100,000 rows by 100 columns stay smooth
• Inline editing with typed editors, validation, and cascade formulas
• Server-side data, WAI-ARIA accessibility, and full keyboard navigation
• AI-native: a bundled MCP server plus llms.txt for Claude, Cursor, and Zed
• MIT-licensed Community core; sv-grid-pro adds export, print, pivot, and AI

How SvGrid compares

• SvGrid vs AG Grid
• SvGrid vs TanStack Table
• SvGrid vs MUI X DataGrid
• SvGrid vs Handsontable
• SvGrid vs svelte-headless-table

Get started · Browse 120+ demos · Documentation · All comparisons · Blog · Pricing

Frequently asked questions

Can I build Svelte data grids for free with SvGrid?

Yes. The sv-grid-community package is free under the MIT License, including commercial use. No license key, no row-count cap, no enterprise upsell pop-ups.

How fast is SvGrid?

It renders 100,000 rows x 100 columns smoothly thanks to row + column virtualization - only the visible window is in the DOM. The headless engine has its own performance test suite tracking the row pipeline.

Can I customize the style of my data grid?

Yes. Re-theme via the --sg-* CSS custom properties (full Tailwind integration documented in the Tailwind guide). Custom cell renderers, header components, and editors all accept any Svelte component or snippet.

Is SvGrid compatible with my framework?

SvGrid is Svelte 5 native - it uses runes ($state / $derived / $effect) and snippets, not Svelte 4 stores. For React / Angular / Vue / vanilla web components, see our sibling product htmlelements.com.

Does SvGrid work with AI tools and assistants?

Yes. It ships an MCP (Model Context Protocol) server so Claude, Cursor, Zed, and other assistants answer accurately about the grid, plus a published llms.txt / llms-full.txt for retrieval. There are AI demos (natural-language filter, smart paste) in the gallery.

How is SvGrid different from TanStack Table?

SvGrid is Svelte-5-native with a built-in <SvGrid /> render component - virtualization, Excel-style filters, cell selection, and inline editing work in one prop pass. TanStack Table is multi-framework and headless-only, so you build the DOM layer yourself. See the Compare page for a side-by-side matrix.

What is the difference between sv-grid-community and sv-grid-pro?

sv-grid-community is the full grid: sorting, filtering, grouping, virtualization, inline editing, server-side data, master/detail, tree, accessibility. Free under the MIT License. sv-grid-pro is a paid companion that adds export (Excel, PDF, CSV, TSV, HTML), a printable view, pivot tables, and AI helpers, plus direct support.

How much does sv-grid-pro cost?

Two license tiers, both per developer. Single Application Developer License ($599) covers one deployed app; Multiple Application Developer License ($999) covers unlimited deployed apps in your organisation. Each is a perpetual license that includes 1 year of updates and support and renews automatically each year - cancel anytime and keep every version from your paid term. Volume / multi-year discounts available.