ModifyThe visual layer for AI coding █
Your agent writes the code.
It just can't see the page.
Modify is the visual CSS editor for OpenCode and terminal AI coding agents. Edit the live page in Chrome, capture exact selectors and before-and-after values, then copy one structured implementation prompt into your terminal.
Built forOpenCode·terminal AI coding agents·CLI-first developers
Edit
Select any element on the live page. Move it, resize it, recolor it, rewrite it — with a Figma-style design panel showing exact values.
Capture
Every change is recorded as a precise delta: selector, CSS property, old value, new value, page context. Nothing is guessed.
Implement
Copy one structured prompt and paste it into OpenCode or another terminal AI coding agent. Your agent maps the approved changes into the codebase.
Figma-grade control. On the live page.
Select real elements and adjust layout, text, spacing, size, and color in place — no DevTools, no describing changes in prose. The design panel shows the numbers while you drag.
Read the docs
Every change captured. Exactly.
Each visual edit becomes a record: selector, property, before and after values. Copy all of it as one structured prompt — a measured implementation brief instead of "move it a bit left".
OpenCode workflow
Plain text out. OpenCode ready.
The exported prompt is structured plain text. Paste it into OpenCode or another terminal AI coding agent without giving the browser extension access to your repository.
CLI agent workflow$ claude
> Pasted from Modify:
button.hero-cta
transform: translate(-24px, 0) ← none
font-size: 15px ← 16px
● Found the styles in hero.css. Applying exact values…
✓ Applied — 1 file changed
$
Capture the live page into Figma.
Need a design baseline, release archive, or comparison point? Capture the current page into Figma before refining the implementation.
See how capture works
Browser-side editing. Explicit handoff.
Modify prepares visual edits and AI prompts in Chrome, then waits for you to copy or export them. It does not connect to your repository or terminal. Account, quota, payment, and export behavior is documented in the privacy policy.
Read the privacy policyRuns in Chrome
Visual editing and prompt preparation happen on the rendered page in your browser.
You control the handoff
Nothing reaches your terminal or repository until you copy the prompt into your coding agent.
One-time $39, no subscription
Lifetime Pro is a single payment with all future updates — no seats, no recurring bill.
“Instead of saying "make this feel less crowded" for the fourth time, I can tune the page directly and hand off the CSS delta with context.”
“Terminal agents are fast, but visual intent gets lost. Modify gives me a way to show the final state first, then let the agent implement it.”
“For design QA, screenshots were too vague and code comments were too slow. A measured prompt with selectors and before-after values is much cleaner.”
Edit precisely.
Prompt exactly.
Ship faster.
Free to start. Lifetime Pro is a single payment — all future updates included.
$39