VibeCode Documentation
Everything you need to build, run, and ship code from your browser.
Getting Started
VibeCode is a full-featured, browser-based code editor powered by WebContainers. It provides a complete development environment with an integrated terminal, live preview, file explorer, and AI assistance -- all without installing anything on your machine.
Whether you are prototyping a new idea, learning to code, or building production apps, VibeCode gives you the tools to go from zero to deployed in minutes.
Sign In
Create an account or sign in with your existing credentials.
Create a Playground
Click "New Playground" from the dashboard to start a new project.
Choose a Template
Pick from React, Next.js, Express, Vue, Angular, or Hono.
Start Coding
Write code, use the integrated terminal, and see live preview instantly.
- A modern browser (Chrome, Edge, or Brave recommended)
- Internet connection for authentication and GitHub features
- Ollama installed locally for AI features (optional)
Editor Features
Full syntax highlighting, IntelliSense, auto-completion, multi-cursor editing, and minimap. The same editor engine that powers VS Code.
Create, rename, and delete files and folders. Drag-and-drop support with a familiar tree view.
Full terminal powered by WebContainers. Run commands, install packages, and start dev servers. Supports multiple tabs.
See your running application in real time. The preview updates automatically as your dev server detects changes.
Open multiple files simultaneously. Unsaved changes are indicated with a dot so you never lose track of edits.
Navigate your file path with clickable breadcrumbs at the top of the editor.
Displays cursor position, language mode, encoding, indentation, and active theme at a glance.
AI Features
VibeCode integrates local AI models via Ollama to provide intelligent coding assistance without sending your code to external servers.
General-purpose conversation about your code, concepts, or architecture.
Get feedback on code quality, best practices, and potential issues.
Paste an error or describe a bug and get targeted debugging help.
Improve performance, reduce bundle size, and refactor for clarity.
GitHub Integration
To use GitHub features, generate a PAT:
- Go to GitHub > Settings > Developer Settings
- Click "Personal access tokens"
- Generate a new token with
reposcope - Paste the token in VibeCode settings
Keyboard Shortcuts
Templates
Kickstart your project with one of our pre-configured templates. Each comes with the framework, bundler, and dependencies pre-installed.
Vite + React with fast HMR
Full-stack React framework with SSR
Minimal Node.js backend server
Vite + Vue for reactive UIs
Full-featured TypeScript framework
Ultrafast edge-first web framework
Setting Up Ollama
Ollama runs AI models locally on your machine. Follow these steps to enable AI features in VibeCode.
Download Ollama
Visit ollama.com and download the installer for your operating system.
Install and Launch
Run the installer and launch Ollama. It runs as a background service on your machine.
Pull a Model
Open a terminal and pull the CodeLlama model:
Verify Installation
Confirm the model is available:
Ready to Go
VibeCode automatically detects Ollama running on localhost:11434. Open VibeCode and AI features will be available immediately.
Frequently Asked Questions
Built with Next.js, Shadcn UI, and WebContainers. Powered by local AI via Ollama.