ssshooter/mindmapcn-svelte — explained in plain English
Analysis updated 2026-05-18
Add an interactive, theme aware mind map view to a Svelte app without building the rendering logic yourself.
Build a docs or knowledge base site with visual outlines that fit a shadcn-svelte design system.
Export a mind map as an image for sharing or embedding in a presentation.
| ssshooter/mindmapcn-svelte | matiadev/svelte-sandbox | keymusicman/compose-bom-changelog | |
|---|---|---|---|
| Stars | 11 | 11 | 13 |
| Language | Svelte | Svelte | Svelte |
| Setup difficulty | easy | easy | easy |
| Complexity | 2/5 | 2/5 | 2/5 |
| Audience | developer | developer | developer |
Figures from each repo's GitHub metadata at analysis time.
mindmapcn-svelte is a set of mind map components built for Svelte 5, designed to fit naturally into projects using shadcn-svelte for styling. It is a full Svelte port of an earlier React version called mindmapcn, and it uses a library called Mind Elixir to actually draw and manage the mind maps. A mind map here means a visual diagram of connected ideas, similar to a tree of notes branching out from a central topic. The component follows your site's dark or light theme automatically, whether that comes from a class on the page, the user's system setting, or an explicit setting you pass in. It works with sensible defaults, so a basic map can be added without much setup, while still exposing the underlying Mind Elixir instance for more control if needed. The package includes controls for zooming, fitting the map to the screen, going fullscreen, and exporting the map as an image. There are also modes meant for presentations, including a read only mode, a compact layout, and a black and white look. To use it, you install dependencies with pnpm and run the dev server. The project ships with a homepage showing live examples, plus documentation pages covering installation, usage examples with source code, the data structure the map expects, and a reference of available props. There is also a text file meant to give AI coding tools a quick summary of the project. Under the hood it is built with Svelte 5, SvelteKit, Tailwind CSS version 4, shadcn-svelte styling, the Mind Elixir library, a snapshot tool for image export, a helper for theme switching, and a syntax highlighter used in the documentation pages. The project credits the original mindmapcn React version, the Mind Elixir library, and shadcn-svelte as the components it builds on. It has 11 stars and is licensed under MIT, which allows free use, including commercial use, as long as the copyright notice is kept.
A library of themeable mind map diagram components for Svelte 5, built to match shadcn-svelte's look and powered by the Mind Elixir mind mapping engine.
Mainly Svelte. The stack also includes Svelte 5, SvelteKit, Tailwind CSS.
Use freely for any purpose, including commercial use, as long as you keep the copyright notice.
Setup difficulty is rated easy, with roughly 30min to a first successful run.
Mainly developer.
This repo across BitVibe Labs
double-check against the repo, no cap.