In short
This Bolt portfolio template gives designers, developers and creatives a complete personal site: a home page with selected work, detailed case study pages, an about page, a writing section and a 404 page. Paste the templates into Bolt, add your own projects and publish a portfolio that looks designed by a studio, in an afternoon.
Who this portfolio template is for
It works for freelancers too. A portfolio with clear case studies and a simple way to book a call turns into the main source of client work, because people who find it already know what you do and the results you bring.
Designers, developers, writers and photographers who want a personal site that shows their work at its best, without spending weeks building it or paying a monthly fee for a site builder.
Hiring managers and clients spend seconds deciding whether to look closer. A portfolio built from these templates puts the work first, explains your thinking in case studies, and makes it easy to get in touch.
Students and career changers benefit most: a polished portfolio closes the gap between a short CV and the skills you actually have.
What each key screen must get right
Home page
Only your best four to six projects. Fewer, stronger pieces beat a long grid.
Case study
Your role, the decisions you made and the result, not just final screens.
About
A real photo, a short story and a clear way to contact you.
Contact
An email link or a short form on every page, not hidden in a menu.
Portfolio screens, one by one
1. Home page
The home page: your name, what you do in one line, and your best projects as large visual cards. It is the page everyone sees, so it shows only your strongest work.
2. Case study
One project from start to finish: the problem, your role, the process with images, the outcome with numbers and what you learned. Case studies are what get people hired.
3. About
Who you are, how you work, the tools you use and where you have worked, with a photo. It turns a list of projects into a person.
4. Writing
A clean article page for writing about your process or industry. Writing shows how you think and helps people find you through search.
5. 404 page
A friendly not found page that sends visitors back to your work.
How to build this portfolio in Bolt
Home page first
Paste the build prompt and the home page template, then describe yourself and your four to six best projects.
Case studies
Add a case study page for each of your top projects with your own images and words.
About and writing
Add the about page with your photo and story, and a writing section if you publish articles.
Publish
Add the 404 page, connect a contact form, set titles and descriptions and publish to your domain.
Supabase tables
The data a portfolio needs. Connect Supabase from Bolt's integrations and Bolt creates these for you.
projectsTitle, client, year, cover image, summary and case study body.messagesName, email and message from the contact form.postsWriting: title, slug, body, date.Bolt portfolio template build prompt
The full Bolt prompt for this portfolio: build order, Supabase tables, row level security, auth and design rules, ready to paste.
Bolt build prompt: PortfolioBuild a portfolio called [product name] for [audience]. Use React, Vite and Tailwind CSS, and connect Supabase from Bolt for any data. DESIGN I will paste a BrowserMoon template for each screen. Match every template exactly: fonts, spacing, colours, corner radius and components. All screens must look like one product. Every screen works at 375px wide with no horizontal scroll.
Common mistakes and how to avoid them
Showing every project
Curate. Every weak project lowers the average.
Images without context
Each project needs a sentence on what it was and what you did.
Slow, heavy images
Compress and resize images so the site loads fast on a phone.
No contact route
Put an email or form within one click of every page.
How to grow your portfolio after launch
Track what works. Add simple analytics and watch which projects people open and where they leave. If one case study keeps people reading, put it first; if a project is skipped, replace it with something stronger.
Keep the portfolio current: replace your weakest project whenever you finish a stronger one, and add a case study for every project you would like more of.
Writing compounds. One article a month about your process or tools brings visitors who never searched for your name, and gives interviewers something to talk about.
Portfolio launch checklist
- Every project image is compressed and has alt text.
- Each case study states your role and the result.
- The contact form or email link works from every page.
- The site looks right on a phone, where most recruiters first open it.
- Your name is in the page title so the site ranks for searches of your name.
- Links to LinkedIn, GitHub or Dribbble work and open the right profiles.
Frequently asked questions
Can I build a portfolio with Bolt?
Yes. Bolt turns these templates into a multi-page portfolio you can publish from Bolt or host anywhere.
Do I need to code?
No. You paste templates and describe your projects; Bolt writes the code. Knowing a little helps for fine tuning.
Is there a developer version?
Yes. Swap the home page for the developer portfolio template, which leads with projects, stack and GitHub.
Can I use my own domain?
Yes. Publish from Bolt and connect your domain, or export the code to any host.
What should a developer portfolio include?
Two or three projects with live links and source code, a short note on the stack and your role, and a clear way to contact you. Recruiters look for shipped work more than long lists of skills.
Should my portfolio have a blog?
It helps if you will write regularly. A few thoughtful posts about how you work make you more memorable than another project card.
How many projects should a portfolio show?
Four to six strong projects is enough. Add a case study page for at least three of them.
Can I add a resume page?
Yes. Ask Bolt for a resume section on the about page or a downloadable PDF link.
Bolt templates by category
More Bolt starter templates