✦ Personal website examples
Personal website examples worth studying
A personal website is the one project with no client. Nobody signs off on it, so it shows what a person really cares about. I build websites for a living, and these are the personal sites I keep going back to. Each one is here for a single idea you can take into your own. I left out template galleries and AI builders: every site on this list was made by the person it’s about.
01: 3D and interactive
Sites you explore instead of scroll
These sites turn the visit into something you do, not just something you read.
Bruno Simon
A creative portfolio you explore instead of scroll. It’s one of the best-known 3D personal sites on the web.
Take this: If your work is interactive, let people play with it on the first screen instead of describing it.
Tobias Ahlin
Home of SpinKit and Moving Letters, small open source animation projects many developers have used.
Take this: Free, useful side projects can do more for your name than a case study.
Jhey Tompkins
Full of playful CSS and JavaScript experiments.
Take this: A site can be a playground. Small demos are easy to share one at a time.
02: Minimal and fast
Quiet sites that load fast
Less on the page means every detail that’s left gets noticed.
Brittany Chiang
A software engineer focused on accessible, inclusive products. A fixed column on the left holds the name and links while experience and projects scroll on the right.
Take this: A simple two-column layout keeps who you are on screen the whole time.
Paco Coursey
A very small, carefully made site from a designer and engineer at Linear.
Take this: When every detail is polished, a short page is enough.
Lee Robinson
It describes him as a developer and writer, and the site reads that way: text first, little decoration.
Take this: If writing is your main work, let the writing be the design.
Emil Kowalski
A design engineer at Linear, known for careful interface animation.
Take this: Small, precise motion reads as craft without getting in the way.
03: Playful motion
Motion that makes people smile
Animation works best when it shows the skill the person wants to be known for.
Josh W. Comeau
Friendly tutorials for front-end developers, with playful interactive details throughout.
Take this: Delight and teaching work together. People share pages they enjoyed using.
Cassie Evans
A developer known for SVG animation, and the site shows it.
Take this: Make your site a live demo of the skill you want to be known for.
Rauno Freiberg
A design engineer whose site focuses on craft and interaction details.
Take this: A small number of strong interaction details beats many average ones.
04: Personality first
Sites that sound like a person
A clear voice and point of view make a site memorable long after the visit.
Lynn Fisher
A web designer, CSS developer and artist who redesigns the site every year.
Take this: A personal site doesn’t have to be permanent. Treat it as a yearly project.
Jessica Hische
A lettering artist, illustrator, type designer and author. The site puts her lettering front and center.
Take this: If your work is visual, let it fill the screen and keep the words short.
Tobias van Schneider
A designer working in New York, with a strong editorial voice across the site.
Take this: A clear point of view in your writing is part of the design.
Adham Dannaway
A product designer and front end developer whose site shows both sides of that work.
Take this: If you do two things, make the split part of the first impression.
05: My own site
How I built mine
I took a few of these ideas into my own site.
Jeffrey Hakim
My gallery opens with a hand-drawn door and a gold key you turn to get in. Then the work rides past as you scroll. The site is built in Framer, with custom code components for the 3D and motion.
Take this: Give people one small thing to do before they see the work. It makes the work feel earned.
06: Make your own
How to make your personal website stand out
Five things every site on this list does well.
Pick one idea
Every site above is known for one thing. Decide yours before you choose colors or fonts.
Show the work early
Visitors decide within a few seconds. Put real work or a real interaction on the first screen.
Write like a person
A short, honest introduction beats a list of buzzwords.
Keep it fast
Big effects only work if the page loads quickly, especially on phones.
Update it
A site that changes gives people a reason to come back and share it again.
07: Questions
Personal website questions, answered
Short answers to what people ask most before building one.
What should a personal website include?
Your name and what you do, a few pieces of your best work, a short about section, and a way to reach you. Everything else is optional.
What’s the difference between a personal website and a portfolio?
A portfolio is mainly a showcase of work. A personal website can also hold writing, side projects and personality. Many of the examples above are both.
Do I need to code a personal website?
No. Tools like Framer, Webflow and Squarespace work well. Coding it yourself gives you more control and can become part of the portfolio.
How many projects should I show?
Usually three to six strong ones. A few great projects beat many average ones.
