Live at lattice.sirreajohn.dev

Lattice is an incredibly fluid infinite canvas application designed to bring spatial organization to your thoughts, architectures, and data. Whether you want to map out software diagrams, write dynamic sticky notes, or build structured nesting boards, Lattice renders it all seamlessly.

It is engineered from the ground up to be blazingly fast using Svelte 5, fully responsive across touch and desktop platforms, and highly secure for true production self-hosting with a local-first philosophy.

• Infinite Spatial Canvas: Native zooming, panning, and rendering without latency restrictions.
• Node Mechanics: Draggable, resizable components including Markdown Text Notes, YouTube Video embeds, and nested 'Decks' or 'Columns'.
• Magnetic Connectivity: Draw smooth, labeled bezier-curve connecting lines directly between Anchor points on any card to map out architectures.
• Hierarchical Nesting: Drag nodes directly inside other 'Column' Decks to automatically inherit hierarchy.
• Database Engine (PGlite):
  • Local Mode: Uses an embedded PostgreSQL database (via PGlite) for fast, secure, local-first storage. No external cloud dependencies required.
  • Temp Mode: An ephemeral, in-memory scratchpad mode where all changes disappear on page reload. Perfect for quick planning without cluttering your main space.
• Dynamic Theming: Fully customizable user interfaces with multiple pre-built color palettes (Default Dark, Dracula, Nord, Monokai, Solarized) and customizable UI tokens.
• Local Authentication: Secures your boards using bcryptjs-hashed authentication, handling user sessions and private boards out of the box.
• Production-Ready Security: Features strict .env checks and out-of-the-box Markdown sanitation (via DOMPurify) to prevent XSS.

Ensure you have Node 20+ installed.

# Install dependencies
npm install

# Start a dev env
npm run dev

Your app will be live at http://localhost:5173.

Lattice is completely self-contained and utilizes Docker alongside its local SQLite/PGlite-powered engine built with the SvelteKit Node Adapter.

Lattice ships with an ultra-lightweight Multi-stage Alpine container configuration. You can boot the entire production-grade server in a single command:

docker compose up -d --build

The container handles dependencies, stripping development tooling, and securely serving the application. It is highly recommended to run this behind a reverse proxy like NGINX, Traefik, or an edge service like Cloudflare Tunnels.

• Frontend: Svelte 5, SvelteKit, TailwindCSS v4
• Backend Database: embedded PostgreSQL (PGlite)
• Authentication: bcrypjs
• DevOps: Docker, Node.js Adapter
• Security: DOMPurify, Marked

• Add image support
• Add file/link support
• Freeform draw tools
• [-] Change card text from md to rich text (descoped, cause document card covers this)
• Add keyboard shortcuts for tools
• overlay card for grouping cards with a title.
• document card to render in full html/md
• kanban board????
• imports and exports of data to local.
• maybe usefull AI features, like semantic vectors to find similar cards or cluster cards of similar topics.

Currently managed and maintained by sirreajohn. Feel free to open issues or pull requests.

Documentation generated by Gemini 3.1