sketch.elixpo

<!-- ELIXPO README - follows the standard template (see STANDARDS.md §4 in the elixpo/elixpo canonical repo). Keep the section order. The product story, screenshots, and run docs are folded under "About" and the product sections. --> <p align="center"> <img src="public/og-image.png" alt="LixSketch - infinite-canvas hand-drawn whiteboard and Notion-like docs editor" width="100%" /> </p> <h1 align="center">LixSketch</h1> <p align="center"> <strong>An infinite-canvas, hand-drawn style whiteboard with a Notion-like docs editor.</strong><br/> Part of the open, ethical, and accessible Elixpo ecosystem - built by a global community of 45+ contributors. </p> <p align="center"> <a href="https://sketch.elixpo.com">sketch.elixpo.com</a> · <a href="https://elixpo.com">Elixpo</a> · <a href="https://github.com/orgs/elixpo/discussions">Discussions</a> · <a href="https://github.com/elixpo/elixpo_chapter">Monorepo</a> </p> <p align="center"> <a href="https://github.com/elixpo/sketch.elixpo/stargazers"><img src="https://img.shields.io/github/stars/elixpo/sketch.elixpo?style=for-the-badge&logo=github&color=5B57D1&labelColor=1a1a2e" alt="GitHub Stars" /></a> <a href="https://github.com/elixpo/sketch.elixpo/network/members"><img src="https://img.shields.io/github/forks/elixpo/sketch.elixpo?style=for-the-badge&logo=github&color=8B88E8&labelColor=1a1a2e" alt="GitHub Forks" /></a> <a href="https://github.com/elixpo/sketch.elixpo/issues"><img src="https://img.shields.io/github/issues/elixpo/sketch.elixpo?style=for-the-badge&logo=github&color=c873e4&labelColor=1a1a2e" alt="GitHub Issues" /></a> <a href="./LICENSE"><img src="https://img.shields.io/github/license/elixpo/sketch.elixpo?style=for-the-badge&color=4A90D9&labelColor=1a1a2e" alt="License" /></a> </p> <p align="center"> <a href="https://sketch.elixpo.com"><img src="https://img.shields.io/badge/Website-sketch.elixpo.com-5B57D1?style=flat-square&logo=googlechrome&logoColor=white" alt="Website" /></a> <a href="https://sketch.elixpo.com/docs"><img src="https://img.shields.io/badge/Docs-LixScript-8B88E8?style=flat-square&logo=bookstack&logoColor=white" alt="Docs" /></a> <a href="https://www.npmjs.com/package/@elixpo/lixsketch"><img src="https://img.shields.io/npm/v/@elixpo/lixsketch?style=flat-square&logo=npm&logoColor=white&color=CB3837" alt="npm" /></a> <a href="https://marketplace.visualstudio.com/items?itemName=elixpo.lixsketch"><img src="https://img.shields.io/badge/VS%20Code-Extension-007ACC?style=flat-square&logo=visualstudiocode&logoColor=white" alt="VS Code" /></a> </p>

---

About

LixSketch is an open-source, freemium platform for collaborative canvas - technical presentations, modelling, wireframes, and more. It pairs an infinite, hand-drawn style whiteboard with a Notion-like docs editor, so you can sketch ideas and write them up in the same place. The official hosted deployment lives at sketch.elixpo.com.

It was one of my most favourite projects to build. It took 11 months to reach the stage where I could write this README and ship the MVP - LixSketch.

LixSketch is part of the Elixpo ecosystem - an open, ethical, and accessible set of AI and developer tools, free to use and shaped by contributors from around the world.

<img width="1866" height="886" alt="LixSketch canvas" src="https://github.com/user-attachments/assets/a0b93c41-32ce-44a1-ac37-4c3f9eb555cd" />

The ecosystem

| Tool | What it does | Link | | --- | --- | --- | | 🎨 Elixpo Art | AI image generation (under dev) | art.elixpo.com | | ✍️ Elixpo Blogs | A rich, modern writing and publishing space | blogs.elixpo.com | | 🖊️ LixSketch | A hand-drawn style whiteboard for ideas and diagrams | sketch.elixpo.com | | 💬 Elixpo Chat | A fluid, real-time AI chat experience (under dev) | chat.elixpo.com | | 🔎 Elixpo Search | Fast, AI-assisted search | search.elixpo.com | | 👤 Elixpo Accounts | One identity (SSO) across the ecosystem | accounts.elixpo.com | | 🔗 lixrl | Our flagship URL shortener | lixrl.com | | 🪪 Portfolios | Personal pages to showcase your work | me.elixpo.com | | 🐼 Oreo | The mascot's home | oreo.elixpo.com |

Developers can drop our editors into their own projects with the @elixpo/lixsketch and @elixpo/lixeditor packages, on npm and as VS Code extensions.

Why LixSketch?

LixSketch offers technical / professional proficiency in quick canvases used for any technical interview, presentation, workshop, or classroom in a collaborative fashion — sharable with anyone at any time in a matter of a click.

<img width="1867" height="874" alt="LixSketch collaboration" src="https://github.com/user-attachments/assets/9971cf94-dba8-4436-b858-4d80e99b246d" />

What Makes LixSketch Stand Out

| | Feature | |---|---| | 🔓 | No login required — start drawing instantly as a guest | | 🎁 | Generous freemium model — powerful tools at zero cost | | 📜 | LixScript — our own diagram scripting language | | 🧩 | All-in-one workspace — combines Excalidraw + TLDraw + Eraser.io | | 🛡️ | E2E encrypted sharing — your data stays yours | | 📂 | Open Source — MIT licensed, built in public | | ⚡ | Fast & free — generous guest mode, no paywall |

<img width="1858" height="884" alt="LixSketch features" src="https://github.com/user-attachments/assets/de4565a2-c6b5-4392-8de2-e76b6b1f5c1e" />

Use LixSketch Everywhere

<div align="center">

| | Platform | Description | |---|---|---| | 🌐 | Web App | Full collaborative canvas in the browser | | 🖥️ | VS Code Extension | Draw diagrams right inside your editor — open any .lixsketch file | | 📦 | NPM Package | Embed the engine in your own app with npm install @elixpo/lixsketch |

</div>

VS Code Extension

Draw diagrams, sketch ideas, and build visual documents — without leaving your editor. Just create a .lixsketch file and start drawing.

ext install elixpo.lixsketch

<img width="1866" height="886" alt="LixSketch VS Code Extension" src="./packages/vscode/media/vs-code-etension-hero.png" />

NPM Package

Build your own whiteboard, diagramming tool, or collaborative canvas with a few lines of code.

npm install @elixpo/lixsketch

import { createSketchEngine, TOOLS } from '@elixpo/lixsketch';

const engine = createSketchEngine(svgElement);
await engine.init();
engine.setActiveTool(TOOLS.RECTANGLE);

Full API docs and examples in the engine README.

Monorepo layout

This repository is a workspace monorepo. The website/app lives at the root, and the publishable artifacts live under packages/:

| Package | What it is | Published as | | --- | --- | --- | | packages/lixsketch | The SVG whiteboard engine + React canvas component | npm @elixpo/lixsketch | | packages/vscode | The LixSketch custom editor for .lixsketch files | VS Code Marketplace elixpo.lixsketch |

Tech Stack

<div align="center">

</div>

Documentation

We have a dedicated section for our LixSketch Docs with a rich definition on how we implemented our architecture and product in the open source with security and transparency.

<img width="1861" height="863" alt="LixSketch docs" src="https://github.com/user-attachments/assets/03130310-9ebb-4916-b0af-ee1c3c78ec60" />

Running this project locally

npm install
npm run dev

This runs the Next.js app and the Cloudflare Worker together. Then open http://localhost:3000.

Local collaboration: npm run dev starts both Next.js and the ROOM Durable Object worker on port 8787. The client defaults to ws://localhost:8787; set NEXT_PUBLIC_ROOM_WS_URL in .env.local to override that endpoint.

Built by the community

Elixpo is made by people, in the open. 45+ contributors have shaped these tools, with a small core team steering the way:

• Ayushman Bhattacharya - Founder & Lead (@Circuit-Overtime)
• Vivek Yadav - Lead Co-Dev (@ez-vivek)
• Anwesha Chakraborty - Core Maintainer (@anwe-ch)

Everyone is welcome. See CONTRIBUTING.md and our Code of Conduct. Found a bug on the platform? Let us know from the Issues Tab.

<img width="1866" height="877" alt="LixSketch community" src="https://github.com/user-attachments/assets/a0c53df1-86bb-47f9-a062-1b8dee0999f6" />

Recognition & programs

Elixpo has taken part in and been supported by GSSOC, Hacktoberfest, Pollinations.AI, MS Startup Foundations, and OSCI.

Get involved

• 💬 Join the conversation in GitHub Discussions.
• 🚀 Submit your project to be featured across the ecosystem.
• 🛠️ Contribute - browse good first issues in the monorepo.

Brand assets

Brand-ready marks and per-service icons are part of the Elixpo brand kit. The brand source of truth (mascot, palette, rules) lives in the canonical elixpo repository, and a browsable kit is at elixpo.com/assets.

License

Elixpo uses one licensing standard across every repository:

• Code - MIT (with the Oreo-trademarks exception).
• Brand & visual assets - CC-BY-4.0 (with the same exception).

The Oreo mascot, the chest E-badge, and the "Elixpo" and "Oreo" names, domains, and palette are reserved - this protects the brand and its royalties while keeping the code and assets free. See LICENSE and the per-product notice board, NOTICE.

Exclusive

Per-repo "exclusive" artifacts (an npm package, a VS Code extension, a hosted SaaS, a paid tier) are declared here and in NOTICE.

This repository ships exclusive artifacts:

• npm package @elixpo/lixsketch (published from packages/lixsketch/) - the published package name @elixpo/lixsketch on the npm registry is reserved to Elixpo; forks must publish under a different name. The MIT-licensed source may be reused. Developers can install it with npm install @elixpo/lixsketch.
• VS Code Marketplace extension elixpo.lixsketch (publisher elixpo, extension lixsketch, published from packages/vscode/) - the Marketplace listing elixpo.lixsketch and the elixpo publisher identity are reserved to Elixpo; the extensio