Grida

Grida is an open-source web app and server that provides a 2D graphics engine and editor. It functions as a web application and server, allowing users to design interfaces, edit SVGs, and manage data through a unified canvas environment. The software is designed for users who need a high-performance design surface that bridges the gap between visual prototyping and live data management.

The software is deployed as a web app but includes a modular SDK for extensibility. It supports both interactive browser-based editing and headless rendering via Node.js for CI and export pipelines. Users can import designs using .fig files or REST JSON, work directly with SVG files, or use the custom .grida document format for complex projects.

Key features

• Dual rendering backends using DOM for HTML/CSS and Skia via WASM for WebGL2
• Headless rendering of files to PNG, JPEG, WebP, PDF, and SVG
• Round-trip-faithful SVG editor that preserves file structure during edits
• Integration with Supabase for database, CMS, and authentication management
• Custom .grida document format based on FlatBuffers for large file efficiency
• Form builder with over 30 input types and logic blocks
• Infinite canvas with fast pan, zoom, and native rich text editing
• Multi-page PDF export and bitmap editing capabilities

The architecture relies on a core engine written in Rust and Skia, exposed to the web through WebAssembly. It includes a specialized rendering pipeline for HTML and CSS that utilizes Stylo and Taffy to align with Chromium standards. Beyond the canvas, the software includes a database and CMS layer that allows users to create gallery views, list views, and charts based on Supabase tables. It also provides a headless SVG editor SDK with React bindings, making it suitable for developers building their own design tools.

Grida is a performance-oriented design tool focused on interoperability and extensible SDKs for the modern web.