skills.rest
Codecaine-AI
Codecaine-AIOFFICIAL
Explore all skills by this author →
WebsiteGitHub

browser-mcp

Automates Chrome browser navigation, interaction, and state capture for debugging and critiques.

1|Updated Apr 18, 2026
Search Tags:#debugging#browser automation#front-end development#Chrome#design critique
One-click install
npx skills add https://github.com/Codecaine-AI/MainMenu --skill browser-mcp
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: browser-mcp
Source: https://github.com/Codecaine-AI/MainMenu/tree/main/.agents/skills/browser-mcp
Command: npx skills add https://github.com/Codecaine-AI/MainMenu --skill browser-mcp

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill automates browser actions, enabling debugging and design critique directly in the user's Chrome browser, eliminating the need for separate browser instances or infrastructure setup.

Core Features & Use Cases

  • Browser Automation: Navigate, interact, and capture states within the user's Chrome browser.
  • Design Critique: Apply Jony Ive's design principles to evaluate UI/UX.
  • Front-End Debugging: Collaboratively identify and fix front-end issues.
  • Use Case: When you need to debug a front-end issue, the skill can help navigate to the page, click elements, and capture screenshots to diagnose the problem.

Quick Start

Execute /browser-mcp:debug to start debugging or /browser-mcp:critique to initiate a design critique.

Frequently Asked Questions about browser-mcp

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate Chrome browser actions for front-end debugging?▼

To automate Chrome browser actions for debugging, you can use this skill to navigate pages, click elements, and capture screenshots directly within your existing browser session. It eliminates the need for separate browser instances or infrastructure setup.

Can I perform a design critique on my UI directly in Chrome?▼

Yes, you can perform a design critique on your UI directly in Chrome. The skill applies Jony Ive's design principles to evaluate your UI/UX, handling state capture and interaction analysis to identify visual and functional improvements.

Do I need to set up a separate browser instance for browser automation?▼

No, you do not need to set up a separate browser instance. The skill operates directly within your active Chrome browser, executing navigation and interaction tasks without requiring additional infrastructure setup or isolated environments.

What is the best way to capture and diagnose front-end issues during development?▼

The best way to capture and diagnose front-end issues is by automating state capture directly in Chrome. The skill navigates to the problematic page, interacts with elements, and captures screenshots to collaboratively identify and fix visual bugs.

Does browser automation for design critique require manual confirmation?▼

Yes, browser automation for design critique requires manual confirmation. The skill handles routine navigation and interaction automatically but pauses for user interaction during judgment calls, ensuring you maintain control over the final evaluation decisions.

Related Skills

Explore More Software Engineering Skills→
MakisuoMakisuo
1.6k

clickhousectl-local-dev

Install and configure a local ClickHouse environment with clickhousectl.

Community
Intermediate
divad12divad12
25

critique

Identify visual UI/UX issues from screenshots and structured criteria.

Community
Intermediate
GrizzwaldHouseGrizzwaldHouse
6

Frontend UI Helper

Generate and refine front-end UI components across React, Vue, and Svelte.

Community
Intermediate
betaTridentbetaTrident

browser-qa

Automate visual regression testing and UI interaction verification for web applications.

Community
Advanced