guataiba

guataiba / isac-cli

Public

Isac is a CLI that generate a complete Design System from Extractions and implements into a pixel-perfect Next.js design system replica, and visually verifies the result — all powered by Claude Code.

github.comguataibaisac-cli ai-design claude-ai cli-tool design-extraction design-systems
10
2
100% credibility
Found Mar 06, 2026 at 10 stars -- GitGems finds repos before they trend. Get early access to the next one.
Sign Up Free
AI Analysis
TypeScript
AI Summary

ISAC is a command-line tool that scans any website to extract its visual style including colors, fonts, branding, and icons, then generates a complete design system and optional page replica for Next.js projects.

How It Works

1
🆕 Start a new project

Create a blank Next.js website to hold your new design.

2
📦 Add the tool

Install the simple command-line helper with one easy instruction.

3
🌐 Pick a website

Choose any live site whose style you want to capture.

4
✨ Capture the magic

Run one command to pull colors, fonts, and branding straight from the site into your project.

5
Choose your goal
🎨
Design system only

Get ready-to-use colors, fonts, and style guide.

📄
Full page clone

Build an exact replica of the homepage too.

6
🚀 Preview live

Start your local server to see the new design in action.

✅ Your style is ready

Enjoy your captured design system or cloned page, perfect for your project.

Sign up to see the full architecture

5 more

Sign Up Free

Star Growth

See how this repo grew from 10 to 10 stars Sign Up Free
Repurpose This Repo

Repurpose is a Pro feature

Generate ready-to-use prompts for X threads, LinkedIn posts, blog posts, YouTube scripts, and more -- with full repo context baked in.

Unlock Repurpose
AI-Generated Review

What is isac-cli?

ISAC-CLI is a TypeScript command-line tool that scans any website URL, extracts fonts, colors, branding, icons, and screenshots, then generates a full Next.js design system with CSS tokens and a visual docs page. Run `isac capture ` inside an existing Next.js project to get globals.css, theme support, and optional pixel-perfect page replication—all verified against originals. Powered by Claude Code for planning and agent-browser for deterministic extractions like isac cli complete design pulls.

Why is it gaining traction?

It skips LLM guesswork on basics—color/font pulls are zero-cost scripts, json-render builds UIs from 14 constrained components, pixel-diff checks fidelity. No project scaffolding needed; just drop into your app for instant dev server previews. Handles light/dark modes, downloads fonts, detects icon libs—faster than manual token hunting or Figma exports.

Who should use this?

Frontend devs prototyping competitor landing pages in Next.js, design handoff teams needing quick token replicas, solo builders mocking sales sites from isac client references like clima dashboards or clinic pages.

Verdict

Worth a spin for Next.js design extractions at 1.0% credibility (10 stars)—solid README/examples, but early-stage with light tests; expect tweaks on complex sites. Pairs well with Claude for code-complete workflows.

Sign up to read the full AI review Sign Up Free

Similar repos coming soon.