Subframe generates React code for your designs which you can export directly to Replit, Bolt, Cursor, or Lovable to speed up development. We’ve created prompts optimized for Replit, or you can export manually.

​
Open Code Mode

  1. Click Code in the top right of your page to open Code Mode.
  2. Select Export to Replit.

​
Set up your Replit project

To sync your Subframe components with Replit, you’ll need to install it for your project. If you’re starting fresh, we recommend using Replit Vite template, but you can use any framework you prefer.

  1. Go to the Setup your Replit project section in Code Mode.
  2. Click Open Replit to create a new Vite app.
  3. Click Generate Replit Prompt — this will create an installation prompt that sets up Subframe and installs any required dependencies.
  4. Copy the generated prompt and paste it into Replit Assistant to run the setup.

​
Export your design to Replit

You can export an entire page or a specific selection from Subframe to Replit.

  1. Copy the Export to Replit prompt and paste it into Replit Assistant. This will sync your components and copy over your design code.
  2. In Replit, modify the prompt as needed to:

Once exported, your design is ready to build on, connect to a backend, or deploy to production.