All Skills
Frontend interactionVuev1.0.0

Parallax laser card

Let light follow your pointer and layers unfold as you move. Adjust the depth and glow, then bring the card into your project.

ParallaxLaser contoursVueCSS 3D

Live demo

Interactive demo

Move your pointer or touch the card to explore its layers

Find your kind of light

Drag the sliders to see the effect live.

From flat contours to floating layers
From a subtle glow to vivid laser light
A static preview is shown when reduced motion is enabled.
FROM DEMO TO PROJECT

Make this effect yours

The package contains the Skill instructions and the Vue component used in this demo. You can also copy the instructions into your AI coding assistant.

Download SKILL.md only
  1. Download and unzip

    Keep the parallax-laser-card/ folder. Its SKILL.md file is the Skill entry point, and assets/ contains the reference component.

  2. Give it to your AI coding assistant

    Add the folder to your project and ask your assistant to read SKILL.md. If your tool supports Skills, follow its installation method.

  3. Describe the result you want

    Read parallax-laser-card/SKILL.md and implement the effect in this project. Set depth to 48px and glow to 70%, keeping both adjustable sliders.

Skill source

SKILL.md
Read full Skill instructions