Getting Started
Jose Tamu
Sep 22, 2025 /
Beginner /
CSS only

Spotlight

Spotlight

How it works

Spotlight is a nestable widget. You can put any content inside by using the Content repeater control: custom code, templates, global widgets and shortcodes.

Animation group

Type: light or dark. Light should be used at lighter backgrounds and the dark at darker backgrounds..
Palette: the palette used at Spotlight is “rainbow” by default but you can set your own colors by selecting a “custom” palette.
Opacity: determines the rays opacity.
Height: determines the height of the rays, not the height of the block.
Speed: determines the speed of the animation.
CSS easing: determines the easing of the animation. You can set any custom CSS easing of your own. Learn more about CSS easings here.