Hello, I'm Nick. I design insane websites and user interfaces.
This is where I talk about all of the cool sites I find online.
Most personal-brand sites still treat the name like a label. A small wordmark in the corner, a portrait, a "Hi, I'm X" intro, and the actual content begins below. The name is metadata.
Juan Mora's portfolio at juanmora.co treats the name like the entire identity system. The wordmark "Juan • Mora" spans the full viewport width in Goga, weight 600, with -2px tracking. There is no logo. There is no avatar. The name is the brand, set at billboard scale, and every subsequent section inherits that confidence.
This is one of the strongest personal portfolio design examples I've come across, and the move is harder to pull off than it looks.
Why name-as-hero works when it works
Most portfolio heroes try to do three things at once. Introduce the person, describe what they do, and tease the work. Three competing signals share a fixed amount of real estate. The result is a hero that reads as cautious. None of the three signals gets enough room to land.
Setting the name at full viewport width forces a different decision. The name becomes the only thing in the room. The role drops to a small subtitle ("Brand & Web Design Specialist / Freelance Design Director"). The work teaser gets nested inside the type, in the gap between "Juan" and "Mora," as a small animated thumbnail. The reader's eye lands on the name first, the role second, the work third. The order of trust is correct.
Juan Mora's site does this with discipline. The wordmark is peach #FFBC95 against cream #FAF6EF. Behind the type sits a warm-graded portrait of Juan at his desk. The portrait is not the hero. The name is. The portrait exists to humanize the wordmark.
What makes the pattern hard
The reason name-as-billboard isn't more common is that it only works with a typeface that can carry the weight. A generic geometric sans at 250px reads as a slide deck. Juan picked Goga, which has enough character at scale to function as identity. The wide tracking, the open apertures, the slightly editorial proportions. The font does the work a logo would normally do.
Try this pattern with a default Webflow heading style and it dies. The type has to be specific enough that the wordmark feels designed, not typeset. This is the move that most "personal brand" templates skip, because picking a typeface is harder than picking a logo.
Three details that hold the system together
The wordmark is the loudest move on the page. The rest of the page is engineered to keep it loud.
One typeface, every scale. The same Goga that sets the hero sets the section headlines at 54px, the body at 18 to 20px, the nav labels at 12 to 13px. No second typeface anywhere. Hierarchy comes from size and weight, not from mixing families. This is the constraint that makes the name-as-hero work. If the next section introduced a serif body face, the wordmark would stop reading as identity and start reading as a header.
Ruthless palette governance. Cream #FAF6EF for paper. Taupe #96908C for body text. Peach #FFBC95 for the accent and the wordmark. One single cobalt blue #1A33FF pop on a handful of small shapes. That's the entire palette. The reader recognizes the brand from any cropped section of the page, because the same five values appear everywhere. A wider palette would dilute the name. This one concentrates it.
Pill-highlighted verbs. In the statement headline "16 years making users [click] and scroll my designs," the word "click" is wrapped in a peach pill highlight. It's a small typographic device, but it solves a problem most premium portfolios don't bother with. How do you make a long-scale headline feel interactive without animating it to death. The pill is a wink, and the wink keeps the page from feeling cold.
The category move this avoids
Most freelance-designer portfolios pick one of two failure modes. They try to be loud (gradient blobs, scroll-jacked spectacle, brutalist type vomit) or they try to be safe (cream background, Helvetica, three case studies, Instagram link). Neither converts well. Loud reads as a junior demo reel. Safe reads as undifferentiated.
Juan's site picks neither. It uses one quiet move, a Unicorn Studio soft-3D blob playground, for delight. The rest of the page is type and air. The whole site is built on the bet that taste, expressed through restraint, sells higher than spectacle. That bet pays off because the wordmark is doing the lifting. The reader is calibrated to the level of craft within the first second.
How to steal this without copying it
The pattern is not "set your name at 250px in peach." The pattern is. Pick one element that can carry the identity, set it at a scale that signals confidence, and engineer everything else to keep that element loud.
For a founder, the element might be a product name. A founder rebranding a SaaS company could set the company name at the same scale, in a typeface that has enough character to function as a logo, with the rest of the page tuned to keep it dominant. For an agency, the element might be a single sentence. For a writer, the lede. The principle is the same. Pick the thing your brand actually is, and let it occupy the room.
The mistake is borrowing the look (giant type, cream background, peach accent) without the structural commitment (one typeface, one palette, ruthless restraint elsewhere). The look without the structure reads as a Dribbble pastiche. The structure is what makes the look work.
Want a portfolio or brand site engineered to this standard?
This is the work Crazy Creative does. The studio builds founder-led brand sites that use one strong identity move and engineer the rest of the page to amplify it instead of competing with it. If you're sitting on a personal brand or company site that feels generic and you want it to do the lifting Juan Mora's wordmark does, the studio lives at crazycreative.design.