How to Set Up the Yocoolab Chrome Extension in 60 Seconds

Getting started with Yocoolab takes less than a minute. No SDK integration. No code changes. No deployment. Just install the Chrome Extension and start pinning feedback directly on any web app — localhost, staging, or production.

Step 1: Install the Extension

Visit the Chrome Web Store and search for "Yocoolab" or install it directly from the [Yocoolab website](https://yocoolab.com). Click "Add to Chrome" and confirm the installation.

That's it. No configuration files. No environment variables. No npm install.

Step 2: Log In

Click the Yocoolab icon in your Chrome toolbar. Sign in with your GitHub or Google account. This takes about 10 seconds.

Yocoolab uses OAuth 2.0 — the same authentication standard used by Google, GitHub, and thousands of enterprise apps. Your credentials are never stored on our servers.

Step 3: Connect Your Repos

After logging in, you'll land on the Yocoolab dashboard at app.yocoolab.com. Connect your GitHub repositories by clicking "Add Repository" and selecting the repos you want to review.

Once connected, the extension automatically detects which repo your page belongs to and routes feedback to the right team.

Step 4: Start Pinning Feedback

Navigate to any page in your web app. Click the floating Yocoolab button (the pink circle in the bottom-right corner of your screen). Then click any element on the page.

A comment panel opens with:

• •A screenshot of the element you clicked
• •The CSS selector and DOM path (captured automatically)
• •The page URL and view context
• •A text input for your feedback

Type your feedback and hit Enter. That's your first pinned comment.

What Happens Behind the Scenes

When you pin a comment, Yocoolab captures:

• •Screenshot — the exact visual state of the element
• •CSS Selector — the precise DOM path to the element
• •Framework Info — React, Vue, Svelte, or vanilla JS
• •Source Location — file and line number (if source maps are available)
• •View Context — what's around the element on the page

All of this happens automatically. You just click and type.

What You Can Do Next

Once you're pinning feedback, the real power of Yocoolab unlocks:

• •Send to Claude Code — Click "Send to Claude" on any thread and Claude receives the full element context, writes the fix, and creates a PR automatically
• •Connect Jira/Linear — Threads sync bidirectionally with your project management tools
• •Notify Slack/Telegram — Team members get notified when feedback is pinned or resolved
• •Track with Kanban — Organize feedback through Backlog → To Do → In Progress → In Review → Done

Works Everywhere

The extension works on:

• •localhost — Review features before they ship
• •Staging — QA on deployed previews
• •Production — Catch visual bugs your users are seeing
• •Vercel/Netlify previews — Review PR preview deployments
• •GitHub Pages — Works on static sites too

No whitelisting needed. No CORS configuration. No SDK injection. The extension operates at the browser level, so it sees the rendered page exactly as your users do.

The Bottom Line

Sixty seconds from zero to reviewing on the real product. No code changes. No deployment. No setup. That's the Yocoolab way — eliminate the tooling friction so your team can focus on shipping.

Install the Extension — Free