Zero-config setup for Tweakr. Open your project — the server starts automatically. No terminal commands, no setup. Just open Chrome, hover over any element, and edit your UI visually. Source code updates instantly.
How It Works
- Open any frontend project in VS Code
- Tweakr auto-detects
src/folder and starts the bridge server - Open your app in Chrome and activate the Tweakr Chrome extension
- Hover over elements to edit text, CSS styles, or delete them
Status Bar
The status bar shows the server state — click it to toggle:
- ✓ Tweakr — Server running (click to stop)
- ⊘ Tweakr — Server stopped (click to start)
Commands
Tweakr: Start ServerTweakr: Stop ServerTweakr: Restart Server
Settings
| Setting | Default | Description |
|---|---|---|
tweakr.port |
3333 |
Bridge server port |
tweakr.autoStart |
true |
Auto-start when project opens |
Requirements
- Tweakr Chrome Extension for visual editing
- Node.js 18+