git404hub

what is mindmapcn-svelte fr?

ssshooter/mindmapcn-svelte — explained in plain English

Analysis updated 2026-05-18

11SvelteAudience · developerComplexity · 2/5LicenseSetup · easy

tl;dr

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.

vibe map

mindmap
  root((mindmapcn-svelte))
    What it does
      Mind map components
      For Svelte 5
      Theme aware
    Tech stack
      Svelte 5
      SvelteKit
      Tailwind CSS
      Mind Elixir
    Use cases
      App mind map view
      Docs site outlines
      Image export
    Audience
      Svelte developers
      UI builders

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

what do people make with this?

VIBE 1

Add an interactive, theme aware mind map view to a Svelte app without building the rendering logic yourself.

VIBE 2

Build a docs or knowledge base site with visual outlines that fit a shadcn-svelte design system.

VIBE 3

Export a mind map as an image for sharing or embedding in a presentation.

what's the stack?

Svelte 5SvelteKitTailwind CSSshadcn-svelteMind Elixir

how it stacks up fr

ssshooter/mindmapcn-sveltematiadev/svelte-sandboxkeymusicman/compose-bom-changelog
Stars111113
LanguageSvelteSvelteSvelte
Setup difficultyeasyeasyeasy
Complexity2/52/52/5
Audiencedeveloperdeveloperdeveloper

Figures from each repo's GitHub metadata at analysis time.

how do i run it?

Difficulty · easy time til it works · 30min
Use freely for any purpose, including commercial use, as long as you keep the copyright notice.

in plain english

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.

prompts (copy fr)

prompt 1
Show me how to add the MindMap component to a Svelte 5 page using the mindmapcn-svelte package.
prompt 2
Write example MindElixirData JSON for a simple 3 level mind map I can pass into mindmapcn-svelte.
prompt 3
Explain how theme switching works in mindmapcn-svelte and how to force dark mode.
prompt 4
Help me add zoom and fullscreen controls to a mindmapcn-svelte MindMap component.

Frequently asked questions

what is mindmapcn-svelte fr?

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.

What language is mindmapcn-svelte written in?

Mainly Svelte. The stack also includes Svelte 5, SvelteKit, Tailwind CSS.

What license does mindmapcn-svelte use?

Use freely for any purpose, including commercial use, as long as you keep the copyright notice.

How hard is mindmapcn-svelte to set up?

Setup difficulty is rated easy, with roughly 30min to a first successful run.

Who is mindmapcn-svelte for?

Mainly developer.

peek the repo → explain another one

This repo across BitVibe Labs

double-check against the repo, no cap.