Lovable.club
Independent education site: Lovable.club is not the official Lovable website. We publish tutorials, prompts, and practical guidance for builders using Lovable.
Build any type of website quickly with LovableTurn your idea into a website, app, or product prototype faster.Start now
👤Personal Portfolio

Portfolio Website Lovable Prompt

Build a stunning personal or creative portfolio to showcase your work and attract clients.

Quick answer

Use this Lovable prompt when you want to build a personal portfolio with clear screens, data structure, responsive UI, practical states, and a useful first version you can refine quickly.

Hero sectionProjects galleryContact formTestimonialsDark modeMobile responsive

The Prompt

Ready-to-use Lovable prompt

Open Lovable
Build a personal portfolio website with the following sections:

**Hero:**
- Full-width hero with name, job title, and one-line value proposition
- Two CTA buttons: "View My Work" (primary) and "Contact Me" (secondary)
- Subtle animation on page load (fade in)

**About:**
- Short bio paragraph (2-3 sentences)
- Skills grid showing technologies and tools with icon badges
- Key stats: years of experience, projects completed, clients

**Work / Projects:**
- Grid of project cards with: project image/thumbnail, title, short description, tech stack tags, and link buttons (Live Demo + GitHub)
- Filter tabs to sort by project type (Web App, Design, Mobile)
- Each project card has a subtle hover effect

**Testimonials:**
- Three testimonial cards with quote, name, job title, and company
- Carousel on mobile, 3-column grid on desktop

**Contact:**
- Simple contact form: name, email, message, send button
- Form connected to an email API (Resend) so messages reach your inbox
- Social links: LinkedIn, GitHub, Twitter/X

**Design:**
- Modern, minimal design
- Dark mode by default with light mode toggle
- Inter or Space Grotesk font
- Smooth scroll between sections
- Fully mobile responsive

Best for

Personal Portfolio

Intent

Copy-ready Lovable build prompt

Difficulty

1/5

How to Use This Prompt

  1. 1

    Copy the prompt

    Use the copy button above so you keep the full structure intact.

  2. 2

    Open Lovable

    Start a new project in Lovable using the official Lovable site.

  3. 3

    Paste and send

    Paste the prompt as the first message before asking for small edits.

  4. 4

    Iterate carefully

    Improve one screen, flow, or state at a time so Lovable has clear direction.

Pro Tips

  • ->Describe the type of work you do upfront — Lovable tailors the layout to your profession
  • ->Mention 'Resend for contact form' so emails actually arrive in your inbox
  • ->Specify your preferred font — Lovable defaults to Inter which is a safe choice
  • ->Ask for 'smooth scroll' explicitly for a polished feel

When to Use This Prompt

Use this prompt when you want Lovable to create a focused personal portfolio instead of a vague app shell. It is best for builders who already know the audience, the main workflow, and the first useful version they want to test.

Do not treat the prompt as a final product specification. Treat it as a strong starting brief. After Lovable creates the first version, review the result against the real user journey: what the user sees first, what action they should take, what happens after success, and what should appear when there is no data yet.

How to Customize the Prompt

Audience

Replace placeholder text with the exact user: founders, students, agencies, customers, admins, sellers, members, or job seekers.

Workflow

Name the main action from start to finish, such as booking, checkout, applying, generating, submitting, approving, or saving.

Data

Add the objects Lovable should model, such as users, projects, products, listings, invoices, bookings, messages, or saved items.

Launch needs

Add analytics, forms, custom domain, GitHub, Supabase, Stripe, security, or production-readiness requirements only when they matter.

Quality Checklist Before You Publish

  • The homepage or first screen explains the product clearly.
  • The main workflow can be completed without confusion.
  • Forms have labels, validation, success states, and error states.
  • Mobile layout works without horizontal scrolling.
  • Empty states explain what to do next.
  • Authentication, database, payments, and AI calls are reviewed before production.
  • Analytics and conversion events are ready before traffic is sent.
  • The next revision request is specific instead of asking Lovable to rebuild everything.

Follow-up Prompts to Improve the First Draft

After the first build, ask Lovable for narrow improvements. For example: improve the mobile layout, add realistic sample data, create an admin view, simplify the onboarding, add empty states, improve the CTA copy, or make the dashboard easier to scan.

Avoid stacking too many changes in one follow-up. Smaller revision prompts make it easier to keep the project stable and understand which change improved the app.

Prompt Variations

Use these versions when your project has a more specific angle.

Designer portfolio

Build a visual designer portfolio with a focus on imagery. Full-bleed hero image. Work section as a masonry grid showing design case studies. Each project opens a modal with full project walkthrough images. Include: logo, brand identity, UI/UX, and illustration categories. Clean, white design that lets the work speak for itself.

Developer portfolio

Build a developer portfolio with a terminal/code aesthetic. Hero with a typing animation showing different roles ('Full-stack developer', 'React specialist', 'Open source contributor'). Featured projects section with GitHub stats (stars, forks). Tech stack section with proficiency bars. Blog section pulling from a JSON file. Dark theme with green accent colour (like a terminal).

Frequently Asked Questions

How long does it take to build a portfolio in Lovable?
A clean single-page portfolio takes 10-20 prompts — about 30-60 minutes. A multi-page portfolio with a contact form, project detail pages, and animations takes 1-3 hours.
Can I use my own domain with a Lovable portfolio?
Yes. Lovable offers custom domain hosting on paid plans. You can also export the code and deploy on Vercel or Netlify with your own domain for free.
Can Lovable add a blog to my portfolio?
Yes. Ask Lovable to add a blog section using a simple JSON file or Supabase for blog posts. Lovable generates the blog list page, individual post pages, and a simple way to add new posts.

Ready to build?

Copy the prompt above, then paste it into Lovable to start your first version.

Try Lovable Free