Build a Portfolio Site
Create a professional portfolio that showcases your work and lands clients
What You'll Build
A polished portfolio website with project case studies, about section, and contact form - live on your custom domain.
- Professional homepage with your best work
- Individual project case study pages
- About section with your story
- Contact form that sends to your email
Prerequisites
- A Framer account (free tier works)
- 3-5 project examples with images and descriptions
- A professional headshot (optional but recommended)
Architecture
Framer handles everything - design, animations, CMS for projects, hosting, and SSL. You design visually, add your projects to the CMS, and publish.
Start with a portfolio template
~5 minChoose a portfolio template and customize the basics.
- Go to framer.com and create a new project
- Browse templates and filter by "Portfolio"
- Choose one that matches your style (minimal, bold, creative)
- The template comes with pre-built pages and CMS - you'll customize everything
Apply your branding
~15 minUpdate colors, fonts, and content to match your personal brand.
- Go to the Design panel and update your color palette
- Choose 1-2 fonts: one for headings, one for body text
- Replace the template's placeholder text with your own copy
- Update the navigation links and page titles
- Add your headshot to the about section
Add your projects to the CMS
~30 minUse Framer's built-in CMS to add project case studies that auto-populate your grid.
- Go to the CMS panel in Framer
- The template should have a "Projects" collection - add your projects
- For each project: add title, description, cover image, tags, and client name
- Add 2-3 detail images per project
- Write a brief case study for each: the problem, your approach, and the result
- The project grid on your homepage auto-updates from the CMS
Add a contact form
~10 minAdd a contact form so potential clients can reach you.
- Add Framer's built-in Form component to your contact section
- Add fields: Name, Email, Message, and optionally Budget and Project Type
- Set the form to email submissions to your inbox
- Style the form to match your site's design
- Test the form by submitting a test entry
Publish on your domain
~5 minPublish your portfolio and connect your custom domain.
- Set your meta title to "Your Name - Designer/Developer/Creator"
- Add a compelling meta description for search results
- Set your OG image (Framer can auto-generate one from your homepage)
- Click Publish and connect your custom domain (yourname.com)
- Share the link on LinkedIn, Twitter, and your email signature
🎉 You're Done!
A polished portfolio website with project case studies, about section, and contact form - live on your custom domain.
Want this built for you?
Get a step-by-step checklist, setup order, and the exact config for every tool in this guide. Or let me build it for you.
Get the checklist → Want this built for you?