Premium element

Visual Effect

Border Stream

Button Stream element creates a dynamic border animation effect on elements, such as buttons, using customizable gradient color streams. This animation provides a lively visual enhancement by streaming colors around the element's border and can be styled with different colors and speeds.

Preview

Button

Quick Setup

data-border-stream=true

Required

Activates the Button Stream effect on the target element (buttons, cards, etc.).

Available Presets

data-stream-preset="preset-name"

Optional

sunlight

sunset

orange

ocean

emerald

amethyst

ruby

midnight

rose

golden

aqua

neon

rainbow

cosmic

aurora

Custom Colors

data-stream-colors

Optional

Allows custom colors instead of preset values. Enter colors as a comma-separated list

Example: #FF0000, #00FF00, #0000FF

Advanced configuration

data-stream-size

Optional

Controls the length of the animated stream/glow segment that moves around the border.

Default: 50

data-stream-duration

Optional

Duration of the streaming animation.

Default: 0.5

data-hover-transition

Optional

Transition duration for the hover effect.

Default: 10

data-glow-on-hover

Optional

Enables or disables a glowing shadow on hover

Default: true

We're here to help

Choose how you'd like to connect with our support team

Contact Support

Get help from our team of experts

Response within 24 hours