socekin/visual-companion — explained in plain English
Analysis updated 2026-05-18
Compare two or more layout or design options as clickable screens in the browser during a coding session.
Turn a verbal design discussion with an AI agent into an interactive mockup instead of plain text.
Sketch and click through diagrams while the underlying conversation continues normally.
Add a visual feedback loop to Claude Code, Codex, or Copilot CLI sessions without extra dependencies.
| socekin/visual-companion | 0xmukesh/docusaurus-tutorial | 1tsmejp/palworld-docker-wine | |
|---|---|---|---|
| Stars | 1 | 1 | 1 |
| Language | JavaScript | JavaScript | JavaScript |
| Last pushed | — | 2021-12-27 | — |
| Maintenance | — | Dormant | — |
| Setup difficulty | easy | easy | moderate |
| Complexity | 2/5 | 2/5 | 4/5 |
| Audience | developer | developer | ops devops |
Figures from each repo's GitHub metadata at analysis time.
Needs Node.js 18+, a Bash shell, and a local browser, no external services or accounts required.
Visual Companion is a skill that can be added to a coding AI agent so that when a conversation turns visual, such as discussing a mockup, comparing two layouts, or sketching a diagram, the agent shows an actual clickable screen in the browser instead of trying to describe the design in plain text. When the person clicks an option on that screen, that click is recorded and fed back into the ongoing conversation as structured feedback, alongside anything typed. It works with several coding agents that support a shared skill format, including Claude Code, Codex, and Copilot CLI. When invoked, the agent starts a small local server written in plain Node.js with no external dependencies, opens a browser window, and writes an HTML screen for each visual question that updates live over a WebSocket connection. Plain text questions stay in the conversation as normal, while the browser shows a simple waiting screen until the next visual question comes up. All the generated screens and session data are saved inside the current project under a dedicated session folder, while the skill's own files stay untouched. Installing it is done either through a tool called skills.sh with a single command, or manually by copying the skill folder into the agent's skills directory. It needs Node.js 18 or newer, a Bash shell, and a local browser to work. A person starts a session by explicitly invoking the skill with a short command describing what they want to compare, and the agent then presents two to four clickable options when a comparison would help, keeping the browser in sync with the conversation. For safety, the local server only listens on the machine's own loopback address and requires a per session access key, and it automatically shuts down after four hours of inactivity. The project is written in JavaScript, released under the MIT license, and the author credits the original design to the Superpowers project by Jesse Vincent, from which this skill was extracted.
An agent skill that turns visual coding discussions, like mockups and layout comparisons, into a live clickable browser screen instead of text descriptions.
Mainly JavaScript. The stack also includes JavaScript, Node.js, WebSocket.
Setup difficulty is rated easy, with roughly 5min to a first successful run.
Mainly developer.
This repo across BitVibe Labs
double-check against the repo, no cap.