The IDE for designing and building with AI.

Design, code, Git, and agent chat in one desktop workspace.

Shape IDE with explorer, editor, and AI chatShape IDE design and preview workspaceShape IDE design and preview workspaceShape IDE design and preview workspaceShape IDE design and preview workspaceShape IDE design and preview workspace

Shape brings design and code together in one focused workspace, with AI, Git, and everything you need to build and ship.

Visual design on the live page

Click an element in preview, tweak it in the sidebar, and apply the change back to source.

http://localhost:3000
Northwind
ProductPricingDocsSign in

Analytics that stay out of the way.

Track signups, usage, and revenue from one dashboard your team actually opens.

Get startedbutton.Get started
94%
activation
12m
events / day
4.8
team rating

Inspect on the page

Select any element in the live preview the same way you would in a design tool.

Sidebar for every token

Layout, fill, type, and radius sit beside the page while you work.

Apply to source

What you change in preview writes back to the file you already have open.

An agent that works in your repo

One thread to search, read files, edit, and run checks without leaving the editor.

Real tool calls

Search, open docs, read files, edit, and run checks in the same thread.

Edits you can see

Diffs land in your project, not a wall of code pasted into chat.

Stays in the loop

Follow-ups, tests, and the next change stay in one conversation.

Design in the source

Color swatches, scrubbers, and layout panels open on the tokens in your file.

12 const alertVariants = cva(
13 "bg-card
HEXRGBHSLOklchTailwind
#22C55E
text-card-foreground"
14 rounded-lg px-4 py-3
15 {
16 variants: ...

Git graph

Branch topology, commits, and refs in the same workbench you write code.

Git · Graph
mainorigin/mainMerge branch 'fix/auth-refresh'alex
v0.9.2Refresh session cookies safelyalex
Add auth refresh helperalex
Wire Stripe webhook handlersam
Scaffold billing meterssam
Initial API routessam

Git without leaving the editor

Pull requests, threads, and checks in the same workbench as your code.

Harden webhook retries#482Open

alexwants to merge into main from fix/auth-refresh· 2h ago

+128-34
alexauthor2h ago

Adds tenant-scoped retry keys and raises the backoff ceiling to match the webhook SLA.

sammember1h ago

Can we add a regression for two tenants sharing the same event id?

alexauthor40m ago

Done - see the new test in webhooks.retry.test.ts.

Conversation that matches GitHub

Threaded PR discussion with authors, associations, and Shape tabs.

Checks and workflows

Flip to Checks for CI runs without opening the browser.

Summarize and open

AI summarize and Open on GitHub stay on the PR header.

Ship from one place

Graph, PRs, and hunk staging live next to the file.

Stage and unstage hunks

Review a real diff, then stage or restore individual hunks without leaving the file.

retry.tsUnstaged · Working Tree
async function processEvent(event, opts) {
- return await fn();
+ const key = ${opts.tenantId}:${event.id};
+ for (let i = 0; i < attempts; i++) {
+ try { return await fn(); }
+ await sleep(backoff(i));
+ }
}
// more context below...
export { processEvent }
export { backoff }
// clipped
Hunk 1/2

One IDE for design and code

Design polish and Git stay next to the file you are editing.

See the docs →

For all kinds of projects

Including all major web programming languages and frameworks.

  • TypeScript
  • JavaScript
  • Python
  • Go
  • Rust
  • HTML
  • CSS
  • Tailwind
  • Vue
  • Svelte
  • Astro
  • Node.js
Learn more