Documentation
v1.8
GETTING STARTED
DYNAMIC ISLAND
Library
Button effects
Brush effect
The Brush Effect adds an artistic brushstroke animation to buttons or interactive elements, enhancing their visual appeal with dynamic, hand-drawn stroke patterns.
Preview
Quick Setup
data-brush
Required
Enables the Brush Effect on the target element.
Advanced configuration
data-brush-color
Optional
Specifies the color of the brushstroke.
Default: #3498db
data-brush-width
Optional
Defines the width of the brushstroke in pixels.
Default: 2
data-brush-duration
Optional
Specifies the animation duration of the brushstroke (in seconds).
Default: 0.8
data-brush-style
Optional
Determines the visual style of the brushstroke. Values: artistic or straight.
Default: artistic
data-brush-direction
Optional
Specifies the animation direction of the brushstroke. Values: left, right, up or down.
Default: right
data-brush-layers
Optional
Determines the number of brushstroke layers for added depth.
Default: 2
data-brush-opacity
Optional
Controls the opacity of the brushstrokes.
Default: 0.8
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