Website designFree→ v0 / Lovable / Claude
Designer Portfolio — Editorial Layout
A case-study-led portfolio with big type, a work grid and a clear hire-me path.
What you get: A responsive portfolio: intro hero, 6-project grid, case-study template, about and contact.
Example output. A simplified example of what this prompt can produce, made by Claude from the prompt using the sample values below. Names, prices and reviews are invented, and your result will differ with your own values and the tool you use.
- name:
- Jonas Weber
- discipline:
- brand designer
- city:
- Lisbon
- heading_font:
- Georgia
- brand_color:
- teal green
- project_count:
- 4
- stack:
- HTML and CSS
Design and build a portfolio website for {{name}}, a {{discipline}} based in {{city}}.
Look and feel: editorial and confident. Large type ({{heading_font}} for headings, a clean sans for body), a restrained palette built around {{brand_color}}, lots of whitespace, subtle motion on scroll only.
Pages and sections:
1. Home — one-sentence positioning statement, a selected-work grid of {{project_count}} projects (image, title, one-line outcome), short about teaser, contact CTA.
2. Case study template — problem, role, process (3 steps with images), result with one real metric, next project link.
3. About — short story, services offered, tools, a downloadable CV link.
4. Contact — email, social links, and a short form with project type and budget range.
Rules: mobile first (works at 375px), semantic HTML, alt text for every image, lighthouse-friendly (no layout shift), keyboard-accessible navigation. Output the complete code in {{stack}} with placeholder images from a single config object.