Vibe Eyes icon

Vibe Eyes

36

Enables LLMs to 'see' browser-based games and applications through vectorized canvas visualization and debug information.

About

Vibe Eyes bridges the gap between browser-based applications and Large Language Models (LLMs) by providing visual and debug context. It employs a client-server architecture where a browser client captures canvas content, console logs, errors, and exceptions. This data is then sent to a Node.js server, which vectorizes the canvas images into compact SVG representations and exposes them alongside debug information via the Model Context Protocol (MCP). This allows LLMs to 'see' what's happening in the application and provides richer context for debugging and assistance, streamlining the development process, especially in "vibe coding" sessions.

Key Features

  • Catches unhandled exceptions with full stack traces
  • 22 GitHub stars
  • Collects console logs and errors in real-time
  • Provides standalone CLI tool for vectorizing individual files
  • Captures and vectorizes canvas elements from browser games
  • Makes the visual and debug information available to LLMs via MCP

Use Cases

  • Debugging browser-based games and applications with LLMs
  • Enhancing LLM-assisted development workflows by providing visual context
  • Automating screenshot capture and debug information sharing during "vibe coding" sessions