# HappyHands

> A local design review workbench that captures product pages, diagnoses UI problems, scopes coding-agent changes, and compares before-and-after results.

HappyHands is an open-source, Local Web Alpha workbench for products built with coding agents, published by ShuaiMXu under the MIT license. It captures pages and interaction states, reviews findings against a product's own design rules, and records the plan, code differences, and review outcome in one local workflow. The final accept or reject decision stays with the user.

## What It Is

HappyHands is a local design review tool for AI-coded projects. You connect a repository and a running preview, state a core user task, and point to design sources such as DESIGN.md, token files, and component folders. The workbench runs locally and is opened in the browser on a local port after `pnpm workbench`. The public website offers guidance, design resources, and a theme studio, but does not run diagnostics online.

## How the Review Loop Works

The workflow captures selected pages on desktop and phone, then presents findings alongside screenshots and source references. Extracted design rules are treated as candidates until approved. After you confirm one problem and a scoped plan, a coding agent implements it in an isolated Git worktree. The result is re-captured and compared with the original evidence, relevant checks and independent review are run, and you record your own decision. Run records are kept under a local `.harness/` directory.

## Coding Agent Support

Codex CLI provides built-in model diagnosis and screenshot-aware review, and is the default implementation adapter. Claude Code has an implementation adapter, though complete end-to-end validation is still open. Cursor, Kimi Code, and WorkBuddy can operate the Harness when they have local browser, terminal, and repository access, but have no dedicated adapters. Model-assisted steps send selected source context and screenshots to the configured model service.

## Design Resources and Theme Studio

The site offers HappyHands, Quartz, and Lime design systems plus component previews. The theme studio lets you adjust colors, fonts, and radii, preview light and dark examples, and export CSS, Tailwind, registry, or Harness-compatible design foundation approval files.

## Current Status

The project describes itself as a free Local Web Alpha. Unreviewed pages and untested interactions remain outside any passed scope, and model review does not replace human acceptance. External model and CLI services may carry their own costs.

## Features
- Page capture across desktop and phone with interaction states
- Screenshot-linked issue findings with source references
- Design rule extraction with approval before use
- Scoped code changes in isolated Git worktrees
- Before-and-after comparison and independent review
- Local run records under .harness/
- Theme studio with CSS, Tailwind, and registry export
- Design system and component preview resources

## Integrations
Codex CLI, Claude Code, Cursor, Kimi Code, WorkBuddy, Git, Chrome, Edge

## Platforms
WEB, API, CLI

## Pricing
Open Source

## Links
- Website: https://happyhands.cc
- Documentation: https://happyhands.cc/guide
- Repository: https://github.com/ShuaiMXu/happyhands
- EveryDev.ai: https://www.everydev.ai/tools/happyhands