Visual Docker Compose Builder — Build docker-compose.yml files with drag-and-drop. No signup, no backend, runs entirely in your browser.
- Drag & drop services — Add nginx, postgres, redis, node or custom services to a visual canvas
- Connect to define dependencies — Draw edges between services to auto-generate
depends_on - Real-time YAML — See your
docker-compose.ymlupdate live as you build - Auto network config — Services are automatically added to shared networks when connected
- YAML import — Paste existing compose files to visualize and edit them
- Copy & download — One-click copy to clipboard or download as
.yml - Undo / Redo — Full undo/redo support with keyboard shortcuts (Ctrl+Z / Ctrl+Y)
- Persistent — Your work is saved in localStorage automatically
- AI generation — Describe your setup in natural language and let AI generate the compose file (supports OpenAI, Anthropic, Gemini, GLM)
- IDE integration — Use as an MCP server with Claude, Cursor, or any MCP-compatible AI tool
- Smart recommendations — Get companion service suggestions (e.g., pgadmin for postgres) with one-click add
Visit vcompose.cc — no installation needed.
git clone https://github.com/zbrave/vcompose.git
cd vcompose
npm install
npm run devOpen http://localhost:5173.
| Layer | Choice |
|---|---|
| Framework | React 18 + TypeScript (strict) |
| Bundler | Vite |
| Canvas | React Flow v11+ |
| State | Zustand |
| Styling | Tailwind CSS |
| YAML | yaml npm package |
| AI | Vercel AI SDK |
| Testing | Vitest + Playwright |
- Drag a service preset from the sidebar onto the canvas
- Configure the service — image, ports, volumes, environment variables, healthcheck
- Connect services by drawing edges to define
depends_onrelationships - Copy the generated YAML from the output panel
docker build -t vcompose .
docker run -p 80:80 vcomposeOr use the pre-built image with any container platform (Coolify, Railway, etc).
Contributions are welcome! Please open an issue first to discuss what you'd like to change.
npm run test # Unit tests (Vitest)
npm run test:e2e # E2E tests (Playwright)
npm run lint # ESLint
npm run format # PrettierMIT