Step-by-step
🚀 Spaces
Hugging Face
📘 Step-by-step guide 📘 Hugging Face · Spacesbeginner 🏠 Everyday life

Launch Your Own Free AI Web App with Hugging Face Spaces

Quickly copy a ready-made AI demo, personalise it, and publish it live on the web in under ten minutes without writing any code.

Ever wanted to share a cool AI tool with friends or just test one out on your own custom web address, without needing to know how to code? This guide will show you how to find a ready-made AI demo, make your own copy of it, and launch it live on the internet for free. While Hugging Face Spaces makes it incredibly easy to launch an AI demo, this process doesn't give you full access to the app's underlying code or advanced customisation without further development steps, which are beyond this beginner guide.

✅ Before you start
  • A free Hugging Face account: If you don't have one yet, visit huggingface.co in your web browser and click the "Sign Up" button, usually found in the top-right corner, to create a free account.
  • Log in to Hugging Face: Once you have an account, return to huggingface.co. Look for a "Log In" button (often near "Sign Up" or your profile icon). Click it, then enter your username or email and password in the boxes provided, and click "Log In".
  • A name for your app: Think of something short, in lowercase, with hyphens (e.g., my-first-summary-bot). This will become part of the public web address (URL) for your app.
  • About ten minutes: The entire process usually takes about 7–10 minutes, so make sure you have a moment to focus.
1

Explore the Spaces Library

Now that you're logged in, it's time to find a ready-made AI demo to copy. Hugging Face is an online platform where people build, share, and find machine learning models and applications; "Spaces" are like mini-apps or interactive demos of AI models.

To begin, look for and click Spaces in the top menu of the Hugging Face homepage; it's often found between "Models" and "Datasets." You'll then land on the Spaces library page, which shows a collection of AI demos. In the search bar at the top of this page, type a keyword like image generator or text summariser and press Enter on your keyboard to browse options. Look for a Space that mentions Gradio or Streamlit – these are user-friendly toolkits that turn complex AI models into simple web pages you can interact with, without needing to know any code. Click on one of the search results to open it.

  • What you see: After clicking a result, you'll land on a specific Space's page, often displaying a live mini web app that you can try right away.
  • What happens next: The chosen Space's demo will load and be ready for interaction on its dedicated page, showing inputs like text boxes or buttons.
  • If it looks different: If the top menu is missing "Spaces," tap the menu icon (usually three horizontal lines or a square of dots) and look for "Spaces" in the list that appears. If your search results don't clearly show Gradio or Streamlit, just pick any popular-looking one.
💬 ExampleSearch for `simple image generator` and open the first result that clearly displays a prompt box (where you'd type text) and an area for a picture to appear.

You'll know it worked when you see a working mini web app (like a form or a text box) displayed prominently on the page, indicating the AI demo is loaded.

2

Choose and Duplicate a Space

You'll now create a personal copy of the Space. This allows you to host it under your own account and, later, even make changes to its appearance or behaviour if you wish.

On the Space page you've opened, look near the top-right corner for a button with three vertical dots (or sometimes a gear icon on smaller screens, or a small page with a plus sign). This button usually indicates more options for the Space. Click this button, and a small menu will appear. From this menu, choose Duplicate this Space. A new page will then open, presenting a form that asks how you want to set up your copy, which is where you'll begin to customise your new app.

  • What you see: The Space's main page, then a pop-up menu after clicking the dots, followed by a new page with a form.
  • What happens next: The form will prompt you for details like the 'Owner' (which will default to your username) and a 'Space name' for your new copy.
  • If it looks different: If you don't see "Duplicate this Space," look for "Create a copy" or "Fork this project" instead; they all perform the same action of making a personal copy.
💬 ExampleLeave the owner as your username. If you duplicated an image generator, suggest a Space name like `my-first-image-generator`.

You'll know it worked when you see a form on your screen with "Space name" as one of the first fields, ready for you to type in.

3

Configure Your New Space

You'll now give your copy a unique name and decide who can see it. These settings confirm your app's basic setup before it launches on the web.

In the designated box for Space name, type a short, friendly name for your app. Remember to use lowercase letters and hyphens for spaces (e.g., my-cool-summary-tool). Below the name, you'll see options for Visibility, which controls who can access your app. Choose Public if you want anyone with the link to be able to open it, or Private if you only want to share it with specific people you invite (private Spaces may require a paid plan for certain advanced features). Next, find the section or drop-down menu labelled Hardware. This setting tells Hugging Face what kind of computing power your app needs. Keep Free CPU basic selected. A CPU (Central Processing Unit) is like the brain of a computer; "Free CPU basic" means you're using Hugging Face's standard, free computing power, which is perfect for simple AI demos and won't cost you anything. After filling in these details, scroll down and click Duplicate Space at the bottom of the form.

  • What you see: A form with clearly labelled fields for 'Space name', 'Visibility', and 'Hardware' options. The 'Hardware' setting is usually a drop-down menu or a list of choices near the bottom of the form.
  • What happens next: Hugging Face begins the process of setting up your app in the background, a process called "building."
  • If it looks different: The 'Hardware' options might be pre-selected; just confirm "Free CPU basic" is active. If a paid option is highlighted, make sure to switch it back to the free one to avoid charges.
💬 ExampleSelect "Public" for visibility and confirm "Free CPU basic" is chosen.

You'll know it worked when the page changes and you see a status message like "Building" or "Loading" with a progress bar or spinning icon, indicating your Space is being prepared.

4

Watch Your Space Build and Launch

Once you've duplicated the Space, Hugging Face needs a moment to prepare it. Your app will go through a "building" phase, where all the necessary components are assembled into a ready-to-use web application.

After clicking "Duplicate Space," you'll be taken to your new Space's dedicated page. Here, you'll see status messages and sometimes a progress bar. This indicates that Hugging Face is preparing your app's runtime environment, which is like setting up a mini-computer on their servers specifically for your app to run on. Be patient, as this can take anywhere from a few seconds to a few minutes, depending on the complexity of the AI model and current server load. During this time, the app isn't quite ready to use yet. Once the building process is complete, the status will change, and your interactive web app will appear, ready for interaction.

  • What you see: Your Space's page will display a section that shows "Building," "Loading," "Running," or similar status indicators. You might also see logs or technical messages below the main app area.
  • What happens next: The status will eventually change to "Running" or similar, and the interactive elements of the AI demo (like text boxes or buttons) will become visible and active within your browser.
  • If it looks different: If it seems stuck on "Building" for more than 5 minutes, try refreshing your browser page. Sometimes a temporary network glitch can affect the display of the status.
💬 ExampleSimply observe the loading status. There's nothing to type here.

You'll know it worked when the "Building" or "Loading" message disappears, and the actual interactive AI demo (like the image generator or summariser interface) appears fully functional on the page.

5

Test and Share Your New App

Your AI web app is now live and running! You can use it yourself and share it with anyone you like, giving them access to the AI tool you've just launched.

With your app fully displayed on the page, try interacting with it. If it's an image generator, type a description into the prompt box and click "Generate." If it's a text summariser, paste some text and click "Summarise." Observe how the AI processes your request and displays its output. To share your app with others, look for the web address (URL) in your browser's address bar. It will typically follow the format [your-username]-[your-space-name].hf.space. Copy this entire link, and you can then paste it into an email, a messaging app, or on social media for others to access your very own AI tool.

  • What you see: The fully functional AI demo interface, responding to your inputs, and your browser's address bar showing the unique URL for your Space.
  • What happens next: The AI will process your request and display its generated output (like an image or a summary) directly within the app interface.
  • If it looks different: If the app doesn't respond, try refreshing the page or checking the logs (often below the app) for error messages. Some free Spaces might be temporarily busy or restart if left idle.
💬 ExampleType `a fluffy cat wearing a tiny party hat, digital art` into the image generator's text box and click the "Generate" button.

You'll know it worked when the AI processes your input and displays a new image or text result, and you can see your unique web address in the browser bar.

⚠️ Common mistakes
  • Forgetting to set visibility to "Public": If you want others to see and use your app, make sure you selected "Public" during Step 3. If you chose "Private," only people you invite can access it, and you might need a paid plan for some sharing options. You can change this setting later on your Space's page by finding the "Settings" or "Manage Space" option.
  • Choosing a paid hardware option: It's easy to accidentally click a more powerful (and paid) hardware option. Always double-check in Step 3 that "Free CPU basic" is selected. Hugging Face usually warns you before incurring costs, but it's best to be vigilant. If you accidentally selected a paid option, go to your Space's settings and switch it back to a free tier.
  • Impatiently refreshing during "Building" phase: While it's tempting to refresh if it seems stuck, constantly refreshing during the "Building" phase can sometimes interrupt the process. Give it a good few minutes (up to 5) before trying a refresh, and trust the status indicators.
🚀 Try it now

Copy the link to your newly launched Hugging Face Space from your browser's address bar and send it to a friend or family member. Ask them to try out your AI app and tell you what they create!

✦ Original step-by-step guide by AI World Co.'s AI editorial team. Written in plain language, reviewed for accuracy.

← Back to all stories