Build a Custom Website with AI Site Builder Relume
In this tutorial, I will explain what Relume is and how you can use this AI no-code tool to build your website– the sitemap, wireframe, and to export it to Figma or Webflow.

Step 1: Create a New Project and Generate a Sitemap
- Go to the Relume website and sign in; on the homepage, click on the New Project button. Give your project a new title and briefly explain what will contain your website.
- Choose the number of pages you want the application to create (The application is designed to create up to five pages for this tutorial). Select the language to be used (English in this tutorial)
- To build the layout of your website which shows the various pages as well as the rank, go to ‘Sitemaps’ then ‘Generate a sitemap’.
Configuring Sitemap Settings
Step 2: Customize Your Sitemap
- Rewrite your generated sitemap and edit it according to your requirements. Allows the deletion or repositioning of the sections up or down on their relative levels. Create other sitemaps for other pages that this website may contain, that is; the courses, about us, and the blog page.
Customizing Sitemap
Step 3: Generate a Wireframe
- Click on the “Wireframe” button to generate a wireframe for all pages.
- Review your wireframe and customize it as needed. Note that the wireframe is responsive and can be viewed on different devices (tablet, mobile).
Generating Wireframe
Step 4: Export to Figma
- Click on “Export” and select “Export to Figma”. Install the Relume plugin for Figma.
Installing Figma Plugin - Open a new Figma project and run the plugin. Select your project and add the sitemap (note: wireframe export is not available in the free plan).
Importing in FIgma
Step 5: Export to Webflow
- Navigate to Webflow and click on ‘Export’ and then ‘Export to Webflow’. Clone the style guide.
- Open Webflow and, using the Relume wireframe, establish a new site. Copy the homepage wireframe and paste it into Webflow.
Exported in Webflow
Step 6: Design and Publish Your Website
- Customize your website in Webflow by adding images and designing elements. Publish your website to a selected domain (e.g., startup.webflow.io).
Publishing Website
Tips and Variations
- Both the starter or pro plan will allow you to export wireframe to Figma or Webflow.
- Further customize your site in Webflow or Figma or in any other way that fits your needs.
- See other examples of Relume, including the React library and Webflow library.
By following these steps, you can create a website without coding knowledge using Relume and Webflow. Happy building!