New

9 buttons. Ready to use.

Timeline Gradient Configurator - BricksFusion
data-timeline-gradient
How to Use & Code Information
  1. Customize your timeline gradient effect using the controls below
  2. Click Copy JS to copy the JavaScript code to clipboard
  3. In Bricks Builder, add a Code element
  4. Paste the JavaScript code
  5. To add the effect to any section: go to Section → Style → Attributes, add data-timeline-gradient as attribute name (leave value empty)
  6. Add data-timeline-item to each timeline item/card inside the container
↓ Scroll to see timeline animation ↓

Project Launch

Initial planning and development phase begins with team formation and requirement analysis.

Development Phase

Core features development and integration testing across multiple platforms and environments.

Beta Testing

User acceptance testing and feedback collection from selected beta users worldwide.

Release

Product launch with full marketing campaign and user onboarding process implementation.

Growth Phase

Scaling operations and expanding features based on user feedback and market demands.

Market Expansion

Entering new markets and establishing partnerships with key industry players.

Innovation Phase

Research and development of next-generation features and technologies.

Global Reach

International expansion and localization for different regions and cultures.

Gradient Colors
Element Gradient
HEX
HSL
HEX
HSL
Line Gradient
HEX
HSL
HEX
HSL
Animation Settings
Item Spacing
20px
Visibility Threshold
75%
Animation Duration
0.8s
Advanced Options
Intersection Point Size
16px