Name Preloader Reveal
A one-shot editorial intro: a progress bar fills and empties while four portraits stack and clip open in the center, a caption rises line by line, and a large name splits into alternating characters, then its first and last letters slide to center and the whole name shrinks into a mix-blend corner mark as the hero headline rises with its dividers.
A visual storyteller focused on shaping timeless fashion narratives through bold composition and refined tone.
A Vision
Captured Through
Dorian Valez
npx shadcn@latest add @compronents/name-preloader-revealInstalls from ui.aryank.space. Needs a registry token and a one-time @compronents entry in components.json. The docs walk through both.
Checking access…
| Prop | Type | Default | Description |
|---|---|---|---|
| images | string[] | 4 BLANK-hosted JPGs | Portraits clipped open in sequence in the center. |
| name | string | "Dorian Valez" | The name split into the reuniting character mark. |
| headingLines | string[] | 3 hero lines | The hero headline rows revealed after the preloader. |
imagesasset-urlThe four stacked preloader portraits.
name / caption / headingLinestextThe reveal name, caption, and hero heading rows.
gsap