How To Use Face Hugging Spaces To Host Your Portfolio For Free

Photo by the Author

# Introduction

An online portfolio is no longer an option. It's usually the first thing people check when they want to see what you can really do. It's not your CV. It's not your LinkedIn. Your job. If you're a developer, data scientist, ML developer, designer, or just learning, a portfolio gives your projects a place to live. And you don't need paid hosting to do it.

Hugging Face Spaces is one of those tools that people don't know about. It's free, easy to use, and good enough to host a clean personal site with live demos. You can keep it simple or add interactive pieces if that suits your work. In this article, we'll cover what Hugging Face Spaces are, why they're great for portfolios, and how to upload your own step-by-step.

# What Are Hugging Face Spaces?

Hugging Face Spaces is a platform that allows you to manage web applications directly from a GitHub repository, making deployment easy and accessible even for beginners. Although originally designed to showcase machine learning demos, the platform has evolved and now supports a variety of use cases, including static websites, Python-based applications, user interactions, and fully functional AI-powered demos. You can create Spaces using:

• Fixed HTML/CSS/JS
• Gradio (Python UI framework)
• Broadcast

For portfolios, this flexibility is a huge advantage. Let's see step by step how to host your portfolio on Hugging Face Spaces for free.

# Step 1: Create a Hugging Face Account

Go to Hugging Face and register.

# Step 2: Preparing Your Portfolio

You can choose one of the following options:

// Option A: Static Website (HTML/CSS/JS)

Your folder might look like this:

portfolio/
│── index.html
│── style.css
│── script.js

// Option B: Python Based Portfolio (Gradio / Streamlit)

This includes files like:

# Step 3: Creating a New Space

1. Click New Space

   

   This opens the next page

   

2. Select:

   • Owner: your username
   • Space Name: eg my portfolio
   • License: MIT (recommended)

3. Select SDK:

   • Static HTML, CSS, and JS portfolios
   • Gradio for interactive portfolios based on Python
   • Live streaming to data dashboards

4. After filling, click Create Space.

   

# Step 4: Upload or Link Your Code

You can upload files directly or link to a GitHub repository.

• With the static SDK, just load the index.html and assets.
• With Gradio or Streamlit, ensure:
• app.py exists
• requirements.txt lists the dependencies

Hugging Face automatically creates and extracts your Space. For example, since I've selected Gradio, I'll click to create an app.py file:

After this, the following page opens:

I will edit the app.py file like this:

import gradio as gr

def contact_message(name, message):
    return f"Thanks {name}! Your message has been received 😊"

with gr.Blocks(title="Eisha's Portfolio") as demo:
    gr.Markdown(
        """
        # 👋 Hi, I'm Kanwal  
        ### AI / ML Enthusiast | Python Developer  

        Welcome to my portfolio!  
        I enjoy building AI-powered applications and clean backend systems.
        """
    )

    gr.Markdown("## 🚀 Projects")
    gr.Markdown(
        """
        **🔹 PDF Parser with LangChain**  
        Custom PDF parsing with header/footer removal and LLM integration.

        **🔹 Case Similarity Finder (FYP)**  
        Finds similar medical/legal cases using LLaMA-based embeddings.

        **🔹 AI Chatbot Demo**  
        Conversational AI built using Hugging Face models.
        """
    )

    gr.Markdown("## Resume")
    gr.Markdown(
        "[Download my resume](
    )

    gr.Markdown("## Contact Me")
    name = gr.Textbox(label="Your Name")
    message = gr.Textbox(label="Your Message", lines=3)
    output = gr.Textbox(label="Response")
    submit = gr.Button("Send Message")
    submit.click(contact_message, inputs=[name, message], outputs=output)

    gr.Markdown(
        """
        ---
        🔗 **GitHub:**   
        🔗 **LinkedIn:**   
        """
    )

demo.launch()

After editing the app.py file, click Assign new file to master:

# Step 5: Your portfolio is live

Now, on the same page, click on the App to view your portfolio.

When you click, you can see your portfolio:

Alternatively, you can also visit https://–.hf.space to view your portfolio. This is your live, shareable portfolio link. The portfolio does not have to be static. You can include:

• About Me section
• Projects with live demos
• Restart the download
• Contact links
• GitHub and LinkedIn

With Gradio, you can make this an interactive experience.

# Tips to Make Your Portfolio Stand Out

1. Add live demos:
   • ML models
   • Chatbots
   • NLP tools
   • Data visualization
2. Keep It Light: Free Spaces have resource limits, so be prepared
3. Use a clean UI: Minimal design over animations
4. Add README.md: Your Space page displays README content, so use it wisely

# Final thoughts

Hugging Face Spaces is more than a demo platform. It is a free, modern, and powerful portfolio management solution. If your work involves code, data, or AI, hosting your portfolio on Spaces quickly sets you apart from traditional static sites. Your portfolio shouldn't just say what you can do. You have to show it live.

Kanwal Mehreen is a machine learning engineer and technical writer with a deep passion for data science and the intersection of AI and medicine. He co-authored the ebook “Increasing Productivity with ChatGPT”. As a Google Generation Scholar 2022 for APAC, he strives for diversity and academic excellence. He has also been recognized as a Teradata Diversity in Tech Scholar, a Mitacs Globalink Research Scholar, and a Harvard WeCode Scholar. Kanwal is a passionate advocate for change, having founded FEMCodes to empower women in STEM fields.