PageCompose
Log in
Visual workspace for AI-built websites

Start with an AI-assisted PageCompose project. Finish visually.

Connect an existing Vite React Git repository in local-first PageCompose, run its real development server, select the rendered website, and map confirmed visual edits back to source. This is the fully browser-tested runtime with TypeScript, Tailwind CSS and shadcn/ui. The Next.js adapter is preliminary. Review the real Git diff before you commit. PageCompose never commits, pushes or deploys for you. Your repository, deployment and host stay yours.

Open the visual workspaceSee the handoff

Local repository workspace · Run the real development server · Source-mapped visual edits · Your host stays yours

PageCompose visual workspaceLocal repository connected
Local Git repositorywebsite / existing source
Working treemain / existing components
Desktop / 14403 source matches found
NORTH / STUDIO
AI-built page, ready to refineSee the change.
Before the handoff.Inspect source
Hero / Content
AI-built pageVisual editCustomer hosting
The gap

Coding agents are fast. Code can be hard to see. Control belongs in the handoff.

Code only

Every visual correction becomes another instruction.

Spacing, hierarchy and responsive detail disappear into prompt loops.

Builder only

The visual surface hides the source of truth.

The result may look close while the customer still cannot review the underlying change.

PageCompose

A visual layer over the repository you already use.

The agent moves fast. You inspect the real website, map the change to source, and review the Git diff.

Product principle

Let AI move faster inside the repository you already own.

  • Ownership

    Work in the existing repository

    PageCompose does not become the host or the source of truth. The customer keeps the working tree and deployment pipeline.

  • Editing

    Map visual selections to source files

    Select the rendered website. PageCompose links uniquely identifiable text and class values to the components that already exist.

  • Evidence

    Review the real Git diff

    Every confirmed direct edit appears as an ordinary working-tree diff before you commit it.

Workflow

From the real development server to a reviewable source change.

  1. Connect the local repository

    Choose an existing Vite React Git working tree with a development script. PageCompose does not copy or host it.

  2. Run the real development server

    Start the browser-tested Vite React project in a separate local process and inspect the actual website through the visual workspace.

  3. Map visual selections to source files

    Select a rendered element and review the ranked source matches before confirming a safe literal edit.

  4. Review the real Git diff

    Inspect the exact additions and removals in the existing working tree, then commit through your normal code workflow.

Product proof

Do not promise more AI. Show the work before it leaves your workflow.

Structured change / Refine hero3 source matches found Ready to review
Operation 01setText / pages/home/hero/headline

Digital solutions for modern companies

Less noise. More direction.

Components selected
3
Quality checks
Passed
Responsive review
3 viewports
Decision
Human
  • Customer-owned source repository stays yours
  • Structured changes instead of opaque rewrites
  • Customer hosting stays outside PageCompose
Built for

One visual layer. Three ways to improve code work.

Solo

For independent creators who care about the source

Let the agent shape structure and variants. You decide on rhythm, typography and responsive detail in the structured project.

Team

For studios with clean handoffs

Work with roles, proposals and client approvals. Every change stays tied to a revision and an actor.

Agency

For parallel client projects

Keep every customer handoff and hosting setup separate while giving each team a visual review layer.

Pricing

Pay for the visual layer. Keep the website infrastructure.

All prices exclude applicable VAT.

Creator

For independent creators who keep code and visual review in one workflow.

€24.17/ month
€290 per year, €58 saved
  • 3 projects
  • 1 members
  • 5 agent keys per project
  • MCP for Codex and Claude Code
  • Visual editing for structured components
  • Rendered source view
  • Repository-ready package
  • Responsive previews and design tokens
  • ShadCN component library
Start now

Studio

Most popular

For teams that design, review and hand off websites together.

€65.83/ month
€790 per year, €158 saved
  • 15 projects
  • 5 members
  • 25 agent keys per project
  • MCP for Codex and Claude Code
  • Visual editing for structured components
  • Rendered source view
  • Repository-ready package
  • Responsive previews and design tokens
  • ShadCN component library
  • Client approvals
Start now

Agency

For agencies with multiple customers, approvals and parallel repositories.

€124.17/ month
€1,490 per year, €298 saved
  • 50 projects
  • 15 members
  • 100 agent keys per project
  • MCP for Codex and Claude Code
  • Visual editing for structured components
  • Rendered source view
  • Repository-ready package
  • Responsive previews and design tokens
  • ShadCN component library
  • Client approvals
Start now
Plan comparison
CreatorStudioAgency
MCP for Codex and Claude CodeIncludedIncludedIncluded
Visual editing for structured componentsIncludedIncludedIncluded
Rendered source viewIncludedIncludedIncluded
Repository-ready packageIncludedIncludedIncluded
Responsive previews and design tokensIncludedIncludedIncluded
ShadCN component libraryIncludedIncludedIncluded
Client approvalsNot includedIncludedIncluded
Priority supportNot includedNot includedIncluded

For business customers only. Prices exclude VAT and are billed in advance. Cancel at the end of the selected billing period.

Questions

Before you connect your first agent.

Are Codex or Claude Code included?

No. You connect your own agent with a project-bound MCP key, keeping model choice, provider and usage costs under your control.

What can I bring into PageCompose?

The fully browser-tested local runtime connects existing Vite React Git repositories with a package.json development script. It directly edits only uniquely mapped text or className literals. Broader component changes remain agent work, and cloud mode never executes arbitrary repositories.

Which repository stack should I start with?

Start with a Vite React repository using TypeScript, Tailwind CSS and shadcn/ui. That is the fully browser-tested real runtime. The Next.js adapter is preliminary. Astro, Nuxt and SvelteKit may preview locally through their existing development scripts but have no TSX source-edit guarantee. A plain React repository without the supported Vite runner does not start. Use the structured PageCompose document and static export for broader changes.

Am I locked into PageCompose?

No. You can inspect the rendered source and download the structured project document plus the deployable static site. Your repository and hosting stay with you.

Who hosts the website?

You do. PageCompose does not host customer websites or domains. Keep the provider, deployment pipeline and runtime you already trust.

How do edits reach my project?

PageCompose writes a confirmed mapped value only after a SHA-256 conflict check, then shows the real Git diff from the existing working tree. You review and commit it through your normal code workflow.

How is MCP access secured?

Keys are project-bound and revocable. Read, proposal and edit permissions are granted separately, and the resulting code remains reviewable.

How do I cancel?

Manage and cancel your subscription in the Paddle customer portal. Access continues until the end of the paid period.

Next step

Give your agent real tools. Keep creative control.

Open your workspace