socekin/visual-companion

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.