skills.rest
Aurora-AI
Aurora-AICOMMUNITY
Explore all skills by this author →
WebsiteGitHub

antigravity-skills

Transforms static HTML into cinematic, web-ready experiences using Draupnir's spectral powers.

1|Updated Feb 2, 2026
Search Tags:#gsap#non-destructive#cinematic#parallax#lenis#scrolltrigger#text-reveal
One-click install
npx skills add https://github.com/Aurora-AI/Certum- --skill antigravity-skills
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: antigravity-skills
Source: https://github.com/Aurora-AI/Certum-/tree/main/.agent/skills/antigravity-skills
Command: npx skills add https://github.com/Aurora-AI/Certum- --skill antigravity-skills

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Antigravity Skills provides a proven framework to transform static HTML into cinematic, motion-rich web experiences using GSAP, ScrollTrigger, and Lenis, without modifying the underlying markup.

Core Features & Use Cases

  • Cinematic entrances, section transitions, and text reveals powered by GSAP, ScrollTrigger, and Lenis.
  • Scroll-driven choreography with smooth, accessible performance patterns and responsive fallbacks.
  • Framework-agnostic templates and prompts for Next.js, Astro, or plain HTML + Vite to accelerate production.
  • Reusable wrappers and prompts to standardize animation workflows across projects (parallax, magnetic interactions, multi-layer depth).

Quick Start

Use the Antigravity Skills to scaffold a cinematic landing by applying the included prompts, components, and prompts to an existing HTML skeleton.

Frequently Asked Questions about antigravity-skills

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add cinematic scroll animations to static HTML without changing the markup?▼

You can create cinematic scroll animations non-destructively by injecting scripts at the end of the body. This approach uses GSAP, ScrollTrigger, and Lenis to layer motion-rich effects over your existing static HTML structure.

Does GSAP ScrollTrigger work with Next.js and Astro for scroll-driven storytelling?▼

Yes, GSAP ScrollTrigger works with Next.js and Astro. You must properly clean up ScrollTrigger instances in reactive frameworks to ensure scroll-driven storytelling performs optimally without memory leaks.

What's the best way to implement smooth parallax and text reveals for a product showcase?▼

The best way to implement smooth parallax and text reveals is by combining GSAP for choreography with Lenis for smooth scrolling. This creates responsive, scroll-driven section transitions tailored for product showcases.

Can I use Lenis and GSAP to create cinematic entrances without altering my existing HTML?▼

Yes, you can use Lenis and GSAP to create cinematic entrances without altering existing HTML. This is achieved through non-destructive script injection at the end of the body, preserving your underlying markup.

Why do my GSAP ScrollTrigger animations break in reactive frameworks like Next.js?▼

GSAP ScrollTrigger animations break in reactive frameworks like Next.js when instances are not properly cleaned up. Implementing correct cleanup routines ensures scroll-driven animations remain stable during component re-rendering.

Related Skills

Explore More Design & Creative Skills→
jangtrinhjangtrinh

motionwind

Convert Tailwind-like animate-* classNames into Motion props at build time.

Community
Advanced
MengToMengTo
4.5k

cinematic-scroll-storytelling

Coordinate Lenis smooth scrolling with GSAP ScrollTrigger for scroll-driven landing page animations.

Community
Advanced
ricardohg1998-createricardohg1998-create

scroll-experience

Create scroll-driven web experiences with GSAP ScrollTrigger and parallax layers.

Community
Intermediate
flatratemechanic1-glitchflatratemechanic1-glitch

Web Animation Patterns

Define layered web animation strategies using CSS, GSAP, and React Three Fiber.

Community
Advanced