Use this template

Clone the GSAP landing page starter.

A production-ready Vite template with multi-page HTML, reusable GSAP animation utilities, cinematic scroll effects, SEO files, and modular CSS.

pulse-studio/ index.html about.html work.html pricing.html contact.html use-template.html src/animations.js src/styles.css .env.example README.md

Clone command

git clone https://github.com/CookieShualon/animated-landing-page.git

What is inside

Clean files you can understand, edit, and ship.

HTML Pages

Multi-page structure

Home, About, Work, Pricing, Contact, and Template pages are plain HTML entries handled by Vite.

GSAP

Reusable motion helpers

Fade, scale, stagger, counters, looped accents, and cinematic scroll utilities live in one animation module.

CSS

Visual system

Responsive sections, cards, forms, pricing, showcase graphics, and cinematic layers are styled from one CSS file.

SEO

Static search files

The public folder includes robots.txt and sitemap.xml so production builds expose them at the site root.

Env

Template control panel

Use .env values to control brand, colors, GitHub links, page toggles, contact details, and animation switches.

Env options

Make it yours without editing every page.

Domain

Set VITE_SITE_URL once to update canonical URLs, robots.txt, and sitemap.xml during builds.

Brand

Change the site name and home URL once, then every header updates automatically.

Navigation

Edit labels, links, and page keys from one array instead of touching each HTML file.

Theme

Set accent colors with env variables and the CSS variables update at runtime.

Pages

Turn optional pages like Pricing, Contact, and Template on or off with simple booleans.

Repository

Point the Template page buttons to your GitHub URL and clone URL from environment variables.

Motion

Enable or disable counters, looping visual accents, and the cinematic scroll sequence.

Setup and env

Start customizing, then control the template from environment variables.

npm install npm run dev npm run build
.env VITE_SITE_URL=https://your-domain.com VITE_TEMPLATE_GITHUB_URL=https://github.com/you/repo VITE_ENABLE_TEMPLATE_PAGE=true VITE_ENABLE_CINEMATIC_SCROLL=true

Set these values in .env locally or in your Vercel project settings to rebrand the site, update the domain, hide optional pages, and tune motion.