Slider or Carousel with navigation using Component States in adobe xd

How to make a carousel and design image sliders in Adobe XD.

If you’re using the Tap trigger to progress the slider, it can actually be created using component states, and built within a single artboard. Using a component for your slider will make it, and the mechanics, reusable across the design.

The process begins in the same way, with just Artboard 1, and three rectangles. This time, once the rectangles are grouped, create a component, either with the right click menu, or the hotkey ( CTR K on Windows).

Now, in the component menu in the top right, click on the + next to Default State. Name the new state Slide 2. With this new state selected, reposition the group so the second slide is centered.
Once that state is set, click the + again and create Slide 3, positioning the third slide in the center of the artboard this time. You should now be able to toggle through the states and see the rectangles reposition.

on connect these together in Prototype mode, once again use the arrow approach, but instead of selecting another artboard as the destination, simply click on the blue arrow, and select the appropriate state from the dropdown on the right. From the first slide, select State 2, and from slide 2 select State 3, etc.


Image Collect : freepik.com

https://www.freepik.com/free-photo/happy-d...
https://www.freepik.com/free-photo/parents...
https://www.freepik.com/free-photo/busines...