Dot Transition Demo | Hyperiux Vault

Loading

Read ArticleRead ArticleRead Article Back to EffectsBack to EffectsBack to Effects

Back to EffectsAbout /effects

Spacing

Distance between grid cells, in px.

Dot Size

Resting dot size, in px.

Max Dot Size

Fully "on" dot size, in px.

Grow Duration

Seconds for a shape to grow in from the resting grid.

Hold Duration

Seconds a fully formed shape holds before shrinking away.

Shrink Duration

Seconds for a shape to shrink back down to the resting grid.

Gap Duration

Seconds of plain resting grid between shrink and the next grow.

Reveal Anchor

Where shapes grow from / collapse into, as a fraction of height (0 = top, 1 = bottom).

Dot Color

Hex color used for the dots.

Background Color

Background color behind the dot grid.