Influence: Short-form video agency landing page template for Next.js.
- Next.js 15
- Tailwind CSS v4
- TypeScript
- 9 sections
- Light
- No API keys
- Updated Oct 7, 2026
Overview
A high-energy landing page for short-form video studios: platform badges in the headline, a phone with floating metrics, a filterable wall of drawn video thumbnails and comparison pricing with a billing switch. No photos to license.
- Made for
- Short-form video studios, Creator agencies, Social media managers
- Highlights
- Phone hero with floating, counting metrics
- Filterable wall of drawn video thumbnails
- Case-study charts drawn from your numbers
- Comparison pricing with a billing switch
- The look
- Soft off-white, near-black ink and one orange. Headlines are heavy Inter Tight with one italic serif phrase. The look comes from the platforms themselves: round pills, social badges in the headline, a phone with floating metrics and vertical thumbnails with live-caption highlights.
Sections
- 01
Hero
Headline with platform badges, a phone with floating metrics, and social proof.
- 02
Numbers strip
A slow strip of headline numbers.
- 03
Results
One case study with a chart, and three smaller ones.
- 04
Work
A wall of drawn video thumbnails with a working filter.
- 05
Process
A dark timeline from footage to posting.
- 06
Creators
One video testimonial and six short quotes.
- 07
Pricing
A comparison table with a billing switch.
- 08
FAQ
Common questions, answered in place.
- 09
Closing block
A final call to book a call.
Remove a section by deleting its line in app/page.tsx, or move the line to reorder.
Built with
Its motion comes from free components in our library, shipped in components/hairline/ so you can use them anywhere else on the page too.
Make it yours
Every word, link and price lives in site.config.ts. TypeScript flags a missing or misspelled field, so you can’t quietly break a section.
| To change | Edit |
|---|---|
| All copy, links, prices, numbers, FAQ | site.config.ts |
| Colours | app/globals.css (@theme) |
| Fonts | app/layout.tsx |
| Which sections appear, and in what order | app/page.tsx |
| The drawn video thumbnails | components/ui/Reel.tsx |
| The platform badges | components/ui/Icons.tsx |
Run it
$ npm install$ npm run devNode.js 18.18 or newer. No environment variables.
Before you go live
The “Book a call” links point at the closing section: replace them with your calendar link in site.config.ts. The creators, handles, numbers and quotes are placeholders, so only publish results you can back up.
Specifications
- Framework
- Next.js 15 (App Router), React 19
- Language
- TypeScript
- Styling
- Tailwind CSS v4 with design tokens and component styles
- Fonts
- Inter Tight, Inter, Playfair Display, self-hosted with next/font
- Dependencies
- next, react, react-dom, lucide-react, clsx, tailwind-merge
- Images
- None. The video thumbnails are drawn from a colour pair, a shape and a hook.
- API keys and environment variables
- None
- Node.js
- 18.18 or newer
- Colour scheme
- Light
- Responsive
- Desktop, tablet and phone
- Accessibility
- Skip link, visible focus, keyboard navigation, reduced motion
- Deploys to
- Vercel, Netlify, Cloudflare Pages or any Node host
- Codebase
- 23 source files, about 1,700 lines
- Last updated
- Oct 7, 2026
License
One license, no tiers. The full text ships as LICENSE.md in the download.
You can
- Use it for your own products
- Use it for any number of client projects
- Change the code and design however you like
- Deploy the result commercially
You can’t
- Resell or share the files as a template, theme or UI kit
- Publish the source as a template in a public repository
Questions
What do I get when I buy Influence?
The complete Influence project as a download: the Next.js app, its config file, a README with setup and customisation notes, and the license. The download link arrives right after checkout.
Can I use Influence for client projects?
Yes. One purchase covers your own products and any number of client projects, and you can change the code however you like. What you can’t do is resell or share the template files themselves as a template or UI kit.
Do I need API keys, a database or a backend?
No. It runs with npm install and npm run dev and deploys to Vercel, Netlify or Cloudflare Pages without any environment variables.
What should I change before I launch?
The “Book a call” links point at the closing section: replace them with your calendar link in site.config.ts. The creators, handles, numbers and quotes are placeholders, so only publish results you can back up.
Do I need to know Next.js?
Basic React helps, but most changes are text edits in site.config.ts. The README walks through colours, fonts and section order.
How do updates work?
Updates to Influence are free. When a new version ships, download it again from the link in your order email.
Can I get a refund?
Yes. If Influence isn’t right for you, reply to your receipt within 14 days and you get your money back.
Should I buy all-access instead?
If you’ll use more than two templates, yes. All-access is $99 for all 17 templates, including Influence and every template added later. Three single templates would cost $117.
All-access
All 17 templates for $99.
Every template in the library, including Influence, and every one added later. Same license, free updates. Less than three single templates.

















