Web hosting for freelancers: a portfolio site that wins clients for you

Build a personal portfolio website for me, a freelance web developer.

About me:
- Name: [Your name]
- Based in: [City, Country], working with clients [worldwide / in your region]
- I help: [who, e.g. SaaS startups and design agencies]
- Speciality: [e.g. fast marketing sites, React front ends, Shopify fixes]
- Experience: [X] years
- Email: [you@yourname.com]
- Profiles: [GitHub URL], [LinkedIn URL], [Upwork or other profile URL]

Sections, in this order:
1. Hero: my name, a one-line promise that says who I help and the result (for example "I build marketing sites that load in under a second"), and two buttons: "Start a project" and "See my work".
2. Selected work: 3 to 6 case-study cards. Each shows the client type, the problem, what I built, the tech stack and one measurable result (speed, conversions or time saved).
3. Services with starting prices: 3 packages, such as a landing page, a full marketing site and a monthly care plan, each with what is included and a "from" price in [currency].
4. Process: 4 steps from discovery call to launch and handover, with typical timelines.
5. Tech stack: text badges for the tools I use, grouped by front end, back end and hosting.
6. Testimonials: 3 client quotes with name, role and company.
7. About: a short first-person bio, a photo and what I am like to work with.
8. FAQ: 5 questions clients ask before hiring a freelance developer (timelines, payment terms, revisions, who owns the code, ongoing support), with short answers.
9. Contact: a form (name, email, budget range dropdown, project details), my email, and a "Book a 20-minute call" link to [booking link].

Design: clean and technical. Dark text on a light background with one accent colour [colour], a monospace font for small labels, subtle hover states, no stock-photo look.

Build a personal portfolio website for me, a freelance [UI/UX / brand / graphic] designer.

About me:
- Name: [Your name]
- Based in: [City, Country], working with clients [worldwide / in your region]
- I help: [who, e.g. B2B SaaS teams, D2C brands, restaurants]
- Speciality: [e.g. onboarding flows, brand identities, packaging]
- Experience: [X] years
- Email: [you@yourname.com]
- Profiles: [Behance or Dribbble URL], [LinkedIn URL]

Sections, in this order:
1. Hero: my name, a one-line promise (for example "I design onboarding flows that turn trials into paying customers"), and two buttons: "Start a project" and "View case studies".
2. Case studies: 3 to 4 large, image-led cards. Each has the brief, my role, process highlights (research, sketches or wireframes, final design) and the outcome. Images keep their aspect ratio.
3. Services with starting prices: 3 offers, such as a brand identity, a UI/UX project and a design retainer, each with deliverables and a "from" price in [currency].
4. Process: Discover, Define, Design, Deliver, with what the client receives at each step.
5. Clients: a strip of client or brand names I have worked with.
6. Testimonials: 3 client quotes with name, role and company.
7. About: a short first-person bio, a photo and the tools I use (for example Figma, Illustrator).
8. FAQ: 5 questions clients ask before hiring a freelance designer (rounds of revisions, file formats delivered, who owns the rights, timelines, payment terms), with short answers.
9. Contact: a form (name, email, budget range dropdown, project details) and my email.

Design: generous white space, large images in a calm grid, one expressive display font for headings with a readable body font, a neutral palette with one accent colour [colour].

Build a personal portfolio website for me, a freelance [copywriter / content writer / technical writer].

About me:
- Name: [Your name]
- Based in: [City, Country], writing for clients [worldwide / in your region]
- Niche: [e.g. B2B SaaS, fintech, health, travel]
- What I write: [e.g. blog posts, website copy, email sequences, case studies]
- Experience: [X] years
- Email: [you@yourname.com]
- Profiles: [LinkedIn URL], [other profile URL]

Sections, in this order:
1. Hero: my name, a one-line promise in the form "I write [type of writing] for [niche] that [result]", and two buttons: "Hire me" and "Read my work".
2. Writing samples: 6 cards, each with the title, the client or publication, the format, a one-line summary and a "Read it" link to [sample URL].
3. Results: 3 short stories with a number each (traffic gained, signups, open rate), written from the client's side.
4. Services and rates: 3 offers (for example blog posts, website copy, a monthly content retainer) with "from" prices in [currency], per piece or per project.
5. Process: brief, outline, first draft, two rounds of edits, final delivery, with turnaround times.
6. Testimonials: 3 client quotes with name, role and company.
7. About: a short first-person bio and a photo.
8. FAQ: 5 questions clients ask before hiring a freelance writer (research, SEO, use of AI tools, revisions, bylines and rights), with short answers.
9. Contact: a form (name, email, type of content, deadline, details) and my email.

Design: editorial. Serif headings, a readable 18px body font, comfortable line length, lots of white space, minimal colour with one accent [colour].

Build a personal portfolio website for me, a freelance video editor.

About me:
- Name: [Your name]
- Based in: [City, Country], working with creators and brands [worldwide / in your region]
- Formats: [e.g. YouTube long-form, Shorts and Reels, ads, podcasts]
- Software: [e.g. Premiere Pro, DaVinci Resolve, After Effects]
- Experience: [X] years
- Email: [you@yourname.com]
- Profiles: [YouTube or Instagram URL], [other profile URL]

Sections, in this order:
1. Hero: my name, a one-line promise (for example "I edit YouTube videos that keep viewers watching"), my showreel, and a "Start a project" button. Show the showreel as a thumbnail image with a play button that loads the YouTube video [video ID] only when clicked, so the page stays fast.
2. Work: a grid of 16:9 thumbnail cards grouped by format. Each card shows the client or channel, the platform and one result (views, watch time or retention), and opens the video on click the same lightweight way.
3. Services and packages: per-video pricing and a monthly package (for example 8 Shorts a month), with "from" prices in [currency].
4. Process and turnaround: how the client sends footage, first cut in [X] days, two revision rounds, final export and delivery.
5. Testimonials: 3 client quotes with name and channel or company.
6. About: a short first-person bio, a photo and my software.
7. FAQ: 5 questions clients ask before hiring a freelance video editor (how to send footage, turnaround, revisions, music licensing, file formats), with short answers.
8. Contact: a form (name, email, channel or brand link, videos per month, details) and my email.

Design: a dark theme with bold display headings, bright accent colour [colour], thumbnail grid with clear play icons.

Build a personal portfolio website for me, a freelance [SEO / paid ads / email / social] marketer.

About me:
- Name: [Your name]
- Based in: [City, Country], working with clients [worldwide / in your region]
- I help: [who, e.g. e-commerce brands, local service businesses, SaaS]
- Channels: [e.g. SEO, Google Ads, Meta ads, email]
- Experience: [X] years
- Email: [you@yourname.com]
- Profiles: [LinkedIn URL], [other profile URL]

Sections, in this order:
1. Hero: my name, a one-line promise tied to a number (for example "I grow organic traffic for e-commerce brands"), and two buttons: "Get a free audit" and "See results".
2. Results: 3 to 4 case studies, each with the client type, the starting point, what I did, and before-and-after numbers shown as large figures.
3. Services with starting prices: an audit, a monthly retainer and a one-off campaign, each with what is included and a "from" price in [currency].
4. How I work: audit, strategy, execution, monthly reporting, with what the client sees each month.
5. Tools: text badges for the tools I use.
6. Testimonials: 3 client quotes with name, role and company.
7. About: a short first-person bio and a photo.
8. FAQ: 5 questions clients ask before hiring a freelance marketer (how long results take, reporting, contract length, ad spend versus my fee, and why I never guarantee rankings), with short answers.
9. Contact: a form (name, email, website URL, monthly budget dropdown, goals) and my email.

Design: confident and data-led. Large numbers, simple bar charts drawn with CSS, a light background and one strong accent colour [colour].

Build a personal website for me, a freelance virtual assistant.

About me:
- Name: [Your name]
- Based in: [City, Country]
- Working hours and time zone: [e.g. 9am to 5pm IST, overlapping US mornings]
- I help: [who, e.g. coaches, small agencies, e-commerce founders]
- Tasks: [e.g. inbox and calendar, customer support, bookkeeping, social media scheduling]
- Experience: [X] years
- Email: [you@yourname.com]
- Profiles: [LinkedIn URL], [other profile URL]

Sections, in this order:
1. Hero: my name, a one-line promise (for example "I take admin off your plate so you can focus on clients"), and two buttons: "Book a free call" and "See packages".
2. Services: my tasks grouped into 3 cards, each with examples of what I handle.
3. Packages: a pricing table for 10, 20 and 40 hours a month in [currency], with what is included.
4. Tools I use: text badges (for example Google Workspace, Notion, Canva, Shopify).
5. How we start: discovery call, a trial week, then ongoing work, with how and when I report.
6. Testimonials: 3 client quotes with name, role and business.
7. About: a short first-person bio and a photo.
8. FAQ: 5 questions clients ask before hiring a virtual assistant (confidentiality, time zones, how we communicate, tool access, minimum hours), with short answers.
9. Contact: a form (name, email, hours needed per month dropdown, tasks) and a "Book a call" link to [booking link].

Design: warm and friendly. Rounded cards, soft colours with one accent [colour], and a clear pricing table.

Technical requirements:
- Output one complete index.html file with all CSS in a <style> tag and only a little vanilla JavaScript. No frameworks, no build step, no external libraries.
- Mobile-first and responsive from 360px wide to large desktops.
- Accessible: semantic HTML (header, nav, main, section, footer), one H1, alt text on every image, visible focus styles and AA colour contrast.
- Fast: a system font stack or at most one web font with font-display: swap, width and height on every image, and loading="lazy" on images below the first screen.
- SEO: a title under 60 characters and a meta description under 160 characters that include my role and niche, Open Graph and Twitter card tags, and a canonical link to https://[yourdomain.com]/.
- Structured data: JSON-LD with Person (name, jobTitle, url, sameAs links to my profiles) and ProfessionalService (services, area served), plus FAQPage for the FAQ section.
- Contact form: a standard HTML <form> with method="POST", a name attribute on every field and a required email field, so a form service can receive it.
- Use relative links and image paths such as images/photo.webp so the site works on any domain.
- Mark every piece of placeholder text I still need to replace with [EDIT].
- Give me the full file in one code block, then list the images I need to add with suggested file names and sizes.