skills.rest
vibe-motion
vibe-motionOFFICIAL
Explore all skills by this author →
WebsiteGitHub

light-spotlight-render

Generate a standalone HTML animation with a swinging spotlight revealing text.

999|70|Updated Mar 17, 2026
Search Tags:#html#interactive#animation#spotlight#text reveal
One-click install
npx skills add https://github.com/vibe-motion/skills --skill light-spotlight-render
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: light-spotlight-render
Source: https://github.com/vibe-motion/skills/tree/main/light-spotlight-render
Command: npx skills add https://github.com/vibe-motion/skills --skill light-spotlight-render

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires python, gsap, and includes scripts (resource) and assets (resource) components.

What problem does it solve?

This Skill automates the creation of HTML animations with a swinging spotlight effect and text reveal, enabling users to easily generate interactive visual effects for presentations and websites.

Core Features & Use Cases

  • Dynamic Spotlight Animation: Generate animations where a spotlight swings over text, creating visual interest and emphasis.
  • Configurable Parameters: Customize the animation with text, swing angle, lamp scale, glow, and colors.
  • Standalone HTML Output: Outputs a standalone HTML file that can be previewed in a web browser.
  • Use Case: For website designers or presenters looking to add interactive visual effects to their work without extensive coding.

Quick Start

Use the light-spotlight-render skill to create an animation with the text 'vibe-motion' and a swing angle of 45 degrees.

Frequently Asked Questions about light-spotlight-render

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

FAQPage Schema
How do I create an HTML spotlight animation with text reveal for a web page?▼

To create an HTML spotlight animation, run the provided Python script with command-line arguments for text, angle, and colors. It outputs a standalone HTML file using GSAP for the swinging spotlight effect over text.

Can I customize the spotlight angle and colors in the generated HTML animation?▼

Yes, you can customize the spotlight animation via command-line arguments to specify text, swing angle, lamp scale, glow, and colors, tailoring the dynamic HTML output to your specific design needs.

Do I need Python and GSAP to run the spotlight text reveal output?▼

Yes, Python is required to execute the generation script, and GSAP is required to drive the swinging spotlight and text reveal animations within the outputted HTML file.

What is the best way to add an interactive spotlight effect to a presentation?▼

The best way to add an interactive spotlight effect is generating a standalone HTML file featuring a swinging spotlight and text reveal, which can be embedded directly into web pages or presentations.

How does a swinging spotlight animation reveal text in HTML?▼

A swinging spotlight reveals text by using GSAP to animate a light source passing over the text, creating dynamic shadows and highlights that emphasize the content within a generated HTML file.

Related Skills

Explore More Design & Creative Skills→
R1ve3raaTechR1ve3raaTech

gsap-timeline

Manages complex animation sequences and nesting for GSAP projects.

Community
Advanced
goupup-aigoupup-ai
2

paper-slides

Generate beamer LaTeX slides and PowerPoint files from academic papers.

Community
Advanced
het8802het8802
3

hyperframes

Automate HTML-based video composition with GSAP animations and synchronized text and audio.

Community
Advanced
whyiloveher2411whyiloveher2411

hyperframes

Create video compositions and animations using HTML and GSAP.

Community
Advanced