Skip to content
AgencyNew

Sorrel — Influencer marketing agency

A cinematic, forest-and-lime template for influencer and creator-marketing agencies: a three.js silk hero, a fanned deck of live creator videos with floating metrics, a pinned programs scroll, a filterable creator wall, a 3D platform ring, case studies and an insights blog.

  • Next.js
  • React
  • TypeScript
  • Tailwind CSS
  • Motion
  • Lenis
  • three.js

One-time payment · Instant download · All sales are final. By buying you agree to the License, Terms and Refund Policy.

silkui.com/page-preview/sorrel
Sorrel hero screenshot

Overview

Sorrel is a cinematic template for influencer-marketing and creator agencies. Near-black backgrounds lit by forest green, lime accents and cream sections, with bold uppercase headlines and a serif-italic accent line.

It's built around real creator video, not stock illustrations:

  • Hero: two lit silk ribbons rendered in three.js drift behind the headline, bulge towards the cursor and twist as you scroll. Beside them, a fanned deck of looping creator videos shuffles on its own, tilts with the pointer, and swaps its floating metric pills for each creator.
  • Programs: the screen stays in place while scrolling moves the focus between a sales funnel, an ROI chart that draws itself and a brand-safety checklist that ticks off line by line
  • Creator wall: filter by niche and the cards rearrange themselves; hover a card to play its video and reveal its best result
  • Platforms & services: a 3D ring of platform logos that turns with scroll, plus an accordion of services with deliverable tags
  • Process: a four-step bento with a booking calendar, creator-fit scores, approval comments and a growing bar chart
  • Results: a 3D coverflow of creator videos you can swipe, click or leave to auto-play, with live numbers under the active card
  • Case studies, pricing and insights: parallax case-study cards, plans with a monthly/quarterly toggle, and the latest articles
  • Contact: a scrolling wall of audience comments next to a working front-end brief form with budget chips and a success state

Highlights

  • three.js silk ribbons in the hero and footer that follow the cursor and twist as you scroll
  • Fanned deck of looping creator videos with floating metric pills and a live campaign card
  • Pinned scroll section that moves focus between a funnel, an ROI chart and a brand-safety checklist
  • Creator wall with niche filters, a 3D platform ring, a results coverflow, case studies and a blog with live contents

Screens

Pinned programs scroll
Sorrel pinned programs scroll screenshot
Filterable creator wall
Sorrel filterable creator wall screenshot
Results coverflow
Sorrel results coverflow screenshot
Case study page
Sorrel case study page screenshot

What's included

  • three.js silk hero & creator deck
  • Brand marquee
  • Animated stats
  • Pinned programs scroll
  • Creator wall with filters
  • 3D platform ring
  • Services accordion
  • Process bento
  • Results coverflow
  • Case studies
  • Pricing with billing toggle
  • Insights preview
  • Comment wall & contact form

Getting started

  1. Install dependencies

    npm install
    
  2. Run the dev server

    npm run dev   # http://localhost:5191
    
  3. Build the static site

    npm run build   # writes the site to out/
    

Deploying

npm run build produces a plain static site in out/, including every case study and article, and runs on any static host. Connect the brief form to your CRM, Formspree or your own API.

License & credits

All creator videos and photos are free Pexels media, trimmed and re-encoded for the web and credited in the README. Platform logos come from Simple Icons (CC0) and remain trademarks of their owners. The agency, clients, creators, figures and quotes are fictional.