TypeUI logoTypeUI

Use TypeUI with Replit

Follow this guide to connect Replit Agent to TypeUI while it builds UI in your project.

Open Replit

Open the Replit project where you want Agent to build or improve UI.

Add TypeUI to Replit

Click the button below to add TypeUI MCP to Replit:

Install in Replit

Manual setup: click Add MCP server and use this TypeUI MCP URL:

Server URL
https://mcp.typeui.sh/mcp

Use:

  • Display name: TypeUI
  • MCP Server URL: https://mcp.typeui.sh/mcp

Click Test & save. Replit connects to TypeUI and walks you through TypeUI authorization.

Choose a theme

Browse the Design Skills page to compare available themes.

Paper theme previewPaperBento theme previewBentoEnterprise theme previewEnterpriseNeobrutalism theme previewNeobrutalismClean theme previewCleanMono theme previewMonoGlassmorphism theme previewGlassmorphismMinimal theme previewMinimalVibrant theme previewVibrantPremium theme previewPremium

After you choose a theme, ask Replit Agent to use it:

I like the Bento style. Let's use it.

Start building UI

Use TypeUI to help me build a landing page.

Tell Replit Agent what to build. TypeUI helps it choose the right style and layout.

Review and refine

Run your app and review the changes. Ask Replit Agent for targeted improvements:

I don't like this pricing section, give me more variations.

TypeUI will now create three pricing variations so you can compare different layouts before choosing one.

Three pricing cards prompt preview
TypeUITypeUIPro

After you choose a direction, tell Replit Agent which one to use:

I like the comparison one. Let's use it.

Once Replit is connected to TypeUI, you can keep working in the same flow: choose a theme, ask for the interface you need, review the generated variations, and tell Replit Agent which direction to continue with.

Lovablev0