Gsap Awwwards Website

rebyteai-template/rebyte-skills/gsap-awwwards-website

by rebyteai-template0062e44684f109fb580e67fe600f581e01fa7209No licenseListed Oct 9, 2026Updated Oct 9, 2026

SPYLT product landing with GSAP scroll animations, React 19, and Tailwind CSS 4.

Instructions onlySoftware Development DevOps & Cloud

AI-generated overview

Scaffolds, builds and deploys a GSAP-animated React 19 product landing page using a template repository.

What it does: This skill walks through cloning a GSAP Awwwards website template, installing dependencies with npm, and producing a production build in the dist directory. It also documents deployment commands for Vercel and Netlify and a local development server on port 5173. The deliverable is a static React 19 landing page styled with Tailwind CSS 4 and animated with GSAP.
When to use it: Use it when you want to set up, build or deploy a scroll-animated product landing page from the provided template. It fits projects that need a React 19, Vite and Tailwind CSS 4 front end with GSAP animations.
Requirements: Node.js with npm, network access to clone the template repository and install packages, and Vercel or Netlify CLI plus a VERCEL_TOKEN for deployment. It ships no scripts; it is instructions only.

GSAP Awwwards Website

A stunning product landing page with GSAP scroll animations, modern React 19 architecture, and Tailwind CSS 4 styling.

Tech Stack

Framework: React 19
Build Tool: Vite
Animation: GSAP
Styling: Tailwind CSS 4
Package Manager: npm
Output: dist directory
Dev Port: 5173

Setup

1. Clone the Template

If the directory is not empty:

bash

git clone --depth 1 https://github.com/Eng0AI/gsap-awwwards-website-template.git _temp_templatemv _temp_template/* _temp_template/.* . 2>/dev/null || truerm -rf _temp_template

git clone --depth 1 https://github.com/Eng0AI/gsap-awwwards-website-template.git _temp_templatemv _temp_template/* _temp_template/.* . 2>/dev/null || truerm -rf _temp_template

2. Remove Git History (Optional)

3. Install Dependencies

Build

Creates a production build in the dist/ directory.

Deploy

CRITICAL: For Vercel, you MUST use vercel build --prod then vercel deploy --prebuilt --prod. Never use vercel --prod directly.

Vercel (Recommended)

bash

vercel pull --yes -t $VERCEL_TOKENvercel build --prod -t $VERCEL_TOKENvercel deploy --prebuilt --prod --yes -t $VERCEL_TOKEN

vercel pull --yes -t $VERCEL_TOKENvercel build --prod -t $VERCEL_TOKENvercel deploy --prebuilt --prod --yes -t $VERCEL_TOKEN

Netlify

Development

Opens at http://localhost:5173

Notes

Static React site - no environment variables needed
Never run npm run dev in VM environment

Source and attribution

Source:rebyteai-template/rebyte-skillsingsap-awwwards-websiteat commit0062e44

License: No license

Content belongs to its original authors. SourceWeft indexes it from a public repository.

Report or request removal

Gsap Awwwards Website

GSAP Awwwards Website

Tech Stack

Setup

1. Clone the Template

2. Remove Git History (Optional)

3. Install Dependencies

Build

Deploy

Vercel (Recommended)

Netlify

Development

Notes

Source and attribution

More from rebyteai-template/rebyte-skills

Awwwards Landing Page

More in Software Development

Playground

M5 Onboard

Cardputer Buddy

Web Design Guidelines

Vercel React Native Skills

Vercel React Best Practices