Decode Card

How it works

Decode Card is a nestable widget. It comes with a Content Mask, and the content put there will be wrapped in a blurry layer that won’t be affected by the Decode animation.

Content tab

Decode Settings group

Typography: of the Decode letters.
Gradient Left & Right: the 2 colors that will create the Decode gradient.
Backdrop Filter Blur: the Backdrop Filter to apply to the Decode spotlight.
Fade Duration
Fade CSS easing: you can set any custom CSS easing of your own. Learn more about CSS easings here.

Content Mask group

You can set the Content Mask’s styles at the Style Tab or using this section, especially to change the Blur and Dimensions.

Animation group

Include Characters: if disabled, the Decode spotlight will consist of just the Gradient.
Characters: the alphabet to be used. Include Characters must be enabled.
Backdrop Filter Blur: the Backdrop Filter to apply to the Decode spotlight.
Text Length: how much text to generate that will be illuminated by the spotlight. It should be a big value if the Decode Card is also a big one.
Gradient size: the size of the Decode’s spotlight.