Studio Hero
A full-viewport studio opener with a we-voice headline, two actions, and a three-fact credential strip below.
A full-viewport studio opener with a we-voice headline, two actions, and a three-fact credential strip below.
Search blocks by description or jump to a page.
The source for every Portfolio block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Studio Hero fills the fold with the studio name and position in a we-voice h1, Field Studio builds products and brands that earn their keep, followed by a lede that names the client type, early-stage software companies who need a senior design partner, not a vendor, two actions, and a three-fact strip: Founded 2018, Team 6 people, Projects delivered 214.
The section uses flex min-h-screen flex-col justify-center so it fills the viewport without dvh or svh units. The three-fact strip anchors the lede with concrete numbers before the visitor scrolls to anything else.
Use this as the opening section of a studio or agency site, with no header above it. The installer swaps the studio name, the position sentence, the lede, and the three facts for their own figures.
A natural flow around it on a Portfolio Pro page:
Before
Nothing; this is the first block on the page.
After
One strong use is the studio agency opener. Other hero positions:
Tip: write the h1 as a claim the studio can defend, not a description of what design studios generally do.