Every template on this page is our own, designed and maintained in-house by uiCookies rather than gathered from around the web. A personal website is a site about one person, and that covers several different jobs: an online CV that a recruiter can skim, a vCard page that says who you are and how to reach you, a freelancer page that sells your services, or a personal blog where the writing matters most. The templates below cover all four, so start from the job the site has to do rather than from the look.
Whatever the format, a one-person site has nowhere to hide. The first screen needs your name, what you do and one obvious next step, whether that is hiring you, downloading a CV or subscribing. Experience should be dated and specific, with achievements under each role rather than a string of adjectives, and the contact route has to work on a phone. A CV site should also hold up when someone prints it or saves it as a PDF to file, and a blog needs type that stays comfortable over several thousand words.
The set spans three generations of our work. Longhand runs on Bootstrap 6, which is still an alpha: the framework is vendored at a pinned commit, but treat it as a head start on v6 rather than a base you must maintain today. Persona, Profile, Online CV, Resumex and Quill use Bootstrap 5 with vanilla JavaScript and no jQuery, while MyProfile is an older Bootstrap 3 build with jQuery that has not been modernised yet. All are static HTML you can download, edit and host anywhere, free for personal and commercial use under the standard uiCookies licence, with attribution optional but always welcome (full terms at uicookies.com/license). Online CV, Resumex and MyProfile carry a footer credit that you can keep, move or remove.
The templates
Longhand
Longhand treats your career as the main argument and gives it two pages. The homepage opens with an identity block, then a dated experience list with achievement bullets under each role, grouped skills, side projects, a writing section and a contact block. The second page is a worked case study with an unusually candid structure: what was actually wrong, what changed, what it moved and what did not work. It suits anyone who still gets asked for a CV and wants the website and the document to be the same thing.
Its standout is a genuine print stylesheet. Print CV turns the page into an A4 document, with the hero reflowed into a letterhead, screen-only sections removed, skill chips set as comma lists and no role split from its bullets. Save as PDF gives a real text PDF that applicant tracking systems can parse. Display-serif editorial design, full light and dark mode, Bootstrap 6 (alpha, pinned) and ESM-only vanilla JavaScript.
Persona
Persona is a one-page vCard and freelancer page for someone who sells their time directly to clients. A split hero pairs a framed portrait with an 'available for work' badge and two calls to action. Below it sit a four-card services block (product design, brand and identity, design systems and art direction in the demo), a filterable grid of six projects, a testimonial slider and a contact section, and the navigation ends in a Hire me link. It fits freelance designers, developers and consultants who want a warm, non-generic look.
A deep-forest-and-marigold palette with Bricolage Grotesque display type sets the tone. The work grid filters by Product, Brand and Editorial, the testimonial slider runs on native scroll-snap with keyboard support, and a skills marquee pauses on hover. The contact form asks for project type and budget, and validates in the browser but sends nothing until you connect a form service. Bootstrap 5, vanilla JavaScript, inline SVG icons, no jQuery.
Profile
Profile packs a complete resume onto one scroll for designers, developers and other professionals who want to look hireable fast. The split hero carries a portrait, an availability pill, a one-line pitch and a Download CV button. From there the page moves through skills with self-assessed bars, a vertical experience timeline with year markers and highlight tags, an education and certification card grid, a filterable selected-work grid (Product, Design systems, Branding, Mobile) and a contact panel on deep ink with social links. Point the Download CV links at your own PDF; the download attribute is already set.
Cool ink, oat paper and a marigold accent give it a calm editorial feel. Skill bars animate into view, the sticky header compacts as you scroll and scrollspy tracks your place, with a skip link, visible focus styles and reduced-motion support built in. The contact form validates on the front end only, so connect it to a form service. Hand-written Bootstrap 5 and vanilla JavaScript, no jQuery.
Online CV
Online CV follows the classic resume-site layout, with a fixed profile column that keeps your photo, name, role and social icons in view while the full CV scrolls beside it. The page opens with a short about introduction, then runs through four expertise blocks, skills, a dated timeline for work experience and education, interests, a portfolio grid and a labelled contact form. It is a sensible choice for job seekers who want a conventional one-page CV online without learning a build tool.
Its appeal is how little there is to manage: the skill meters and timeline are pure CSS, so changing a level or adding a job is a markup edit with nothing to configure. On smaller screens the layout stacks into one column. Bootstrap 5 with vanilla JavaScript and no jQuery, plus Font Awesome icons. The contact form is markup only until you point it at a form service.
Resumex
Resumex shares its section order with Online CV: a profile column, four expertise highlight blocks, skills, a dated timeline for work and education, interests, a portfolio grid and a labelled contact form. Where it differs is in the details. The profile column, with your photo, name, role and social icons, stays in view using native CSS position: sticky rather than a sidebar plugin, and the skill meters carry floating percentage badges. Pick it for a straightforward online resume where your contact links should never be more than a glance away.
The sticky column is the reason to choose it on a long resume, and on small screens it moves to the top with the sections flowing beneath. Skill meters and the timeline are CSS-only. Bootstrap 5 with vanilla JavaScript and no jQuery, with Font Awesome icons bundled. As with every form here, the contact form needs a form service or backend before it sends anything.
MyProfile
MyProfile is an older one-page CV aimed at freelancers who win work through job marketplaces. After the profile header come 'My Activity' and 'Work History' blocks, a specialities section (WordPress, Joomla, Drupal and Shopify work in the demo), coding and design-tool skills, work experience, education, a Marketplace Profile section listing Envato Studio, Freelancer, Upwork and PeoplePerHour, a portfolio, recent reviews and a contact form. If your reputation lives on those platforms, that marketplace block is something none of the newer templates here includes.
Be clear about what you are getting: this is a legacy Bootstrap 3.3.6 build with jQuery 2.1.4 and Owl Carousel that has not been modernised, and it still loads old Internet Explorer shims. It remains a workable starting point if you are comfortable with older markup. The contact form needs connecting to a form service before it sends anything.
Quill
Quill turns the personal site into a place to write, and it is the one blog in this set. Instead of a feed of image cards, the home page reads like a book's contents page, listing essays with folio numbers, hairline rules, leader dots, dates and reading times, followed by a topics list, an 'On the desk / Now reading' section, an about-the-author band and a newsletter sign-up. The second page is a single long-form essay with a drop cap, pull quotes and footnotes. It suits essayists, columnists and anyone keeping a journal online.
The footnotes are real: superscript markers smooth-scroll down to their notes and back again, and articles add a reading-progress bar and a floating back-to-top button. Oat paper, soft ink and one moss accent frame a Newsreader and Hanken Grotesk pairing. The newsletter form validates inline but needs a mailing provider behind it. Bootstrap 5 and vanilla JavaScript, no jQuery, no icon fonts.
Compare at a glance
| Template | Best for | Pages | Standout feature |
|---|---|---|---|
| Longhand | Printable CV with a case study | 2 | Print stylesheet outputs a clean A4 CV |
| Persona | Freelancers selling their services | 1 | Hire-me flow with project-type and budget fields |
| Profile | Designers and developers job hunting | 1 | Download CV button, timeline and skill bars |
| Online CV | Conventional one-page online CV | 1 | Fixed profile column, CSS-only meters and timeline |
| Resumex | Straightforward online resume | 1 | Sticky profile column, percentage-badge skill meters |
| MyProfile | Freelancers on job marketplaces | 1 | Marketplace profiles for Upwork, Freelancer, PeoplePerHour |
| Quill | Essayists and personal journals | 2 | Book-style contents page and real footnotes |
How to choose
Start with the job the site has to do. If it is mainly a CV, look at Longhand, Profile, Online CV and Resumex: Longhand if people will print or file it, Profile if you want a Download CV button and a work grid alongside the timeline, and Online CV or Resumex for a conventional layout with your profile pinned beside the content (the two share a structure, so choose on looks). If the site should win clients rather than a job, Persona's services block, Hire me link and budget field make it a freelancer page first. MyProfile suits freelancers whose track record lives on job marketplaces, provided you accept an older jQuery build. And if you mainly want to write, Quill is the only blog here.
A few things this page does not cover. If what you need is mainly a showcase of projects, such as a designer's or photographer's body of work, the separate Portfolio & Resume hub is the better place to look; the templates above treat work samples as one section among several. If you searched for personal branding themes, note that these are static HTML templates, not WordPress themes, so they go live on any static host as they are. And whichever you choose, the contact, hire-me and newsletter forms only validate in the browser until you connect them to a form service or your inbox.
Frequently asked questions
Can visitors print my CV or save it as a PDF from the website?
Longhand is built for exactly that. Its print stylesheet turns the homepage into an A4 CV with a letterhead, screen-only sections removed and no role split across a page break, and Save as PDF in the browser's print dialogue produces a text PDF that applicant tracking systems can parse. Profile takes a different route, with Download CV links in the header and hero that you point at your own PDF file. With the other templates, keep a separate PDF of your CV to link to or send.
Do the contact and hire-me forms send me messages?
Not on their own. Every form here, including Persona's project-type and budget fields and Quill's newsletter sign-up, validates in the browser but sends nothing until you connect it to a form service, your inbox or a backend; for a newsletter, that means a mailing provider. Longhand has no form at all, so its contact section has nothing to wire up.
Can I keep a blog on a personal website template?
Quill is the one designed for it, with an essay index plus a full article page that has footnotes, pull quotes and a reading-progress bar. Longhand includes a Writing section on its homepage for listing articles. Both are static HTML with no post editor, so a new essay means copying the article page and adding it to the index, or moving the markup into a static-site generator or CMS.
Are these WordPress personal branding themes?
No. They are static HTML templates: download the ZIP, edit the files and upload the folder to any static host, with no database or plugins to maintain. If you later want to run your personal brand on WordPress, the markup can be turned into a theme, but that is a development job rather than a one-click install.
Can I use these for a client's personal site, and do I have to keep the credit?
Yes. Every template here is free for personal and commercial work, including sites you build for clients, under the standard uiCookies licence. You don’t have to keep the credit: Online CV, Resumex and MyProfile carry a footer credit that you can keep, move or remove, and attribution is optional but always welcome. The full terms are at uicookies.com/license.
Related templates
Free Portfolio & Resume Website Templates · Free Blog Website Templates · All free HTML website templates
