Search

insert

start

insert

design

insert

scroll

insert

navigation

insert

effects

insert

cms

insert

localization

insert

templates

insert

management

insert

integrations

insert

code

insert

courses

Create beautiful interactive Carousels

Create beautiful interactive Carousels

Design smooth CSS-based carousels that can be scrolled, swiped, and navigated between using either arrows or dots.

Beginner

In this video, we introduce two new components, the carousel component and the ticker component. Both components unlock entirely new use cases when it comes to designing interactive websites.

The Ticker Component

The ticker component is optimized for creating infinitely looping animations. It is highly customizable and works in any direction. It also adds some fun new interactions like the ability to slow it down on hover.

To use the ticker component, simply drag and drop it onto the canvas. You can then connect it to any layer or component on your canvas. The ticker will automatically handle the duplication for you, figuring out the optimal amount of duplication to create the best performing infinite loops.

The Carousel Component

The carousel component allows you to create scrollable areas either horizontally or vertically. It can optionally include scroll snapping and arrow controls.

To use the carousel component, drag and drop it onto the canvas. You can then connect it to any layer or component on your canvas. The carousel is also highly customizable and shares a lot of the same styling options as the ticker component.

Conclusion

We are excited to share these components with you and we can't wait to see what you will end up creating. As always, thank you so much for watching and stay tuned for more updates coming soon.