Bootstrap 5 Carousel Maker

Create and customize your Bootstrap 5 carousel with ease

Carousel Options

Carousel Type Select the type of carousel you want to create

Number of Slides Set how many slides your carousel will have

Slide Content Configure each slide's content

Slide Interval Time between slides in milliseconds (5000 = 5 seconds)

1s 5s 10s

Indicators Show/hide navigation dots at the bottom

Show Indicators

Indicator Color

Indicator Size

Navigation Controls Show/hide previous and next buttons

Show Controls

Additional Options Configure additional carousel behaviors

Auto-Rotate

Pause on Hover

Keyboard Navigation

Fade Effect

Draggable Slides

Styling Options Configure the visual appearance of your carousel

Border

Shadow

Rounded Corners

Orientation

Custom Classes

Accessibility Add accessibility attributes for better screen reader support

Enable Accessibility Attributes

ARIA Label

Live Preview

Generated Code

// Code will appear here as you customize the carousel

Helpful Information

Usage Instructions

1. Configure options in the left panel.
For Number of slides, you need to press the "Update" button.
Scroll the options down to keep "Live Preview" visible all the time

2. Preview your carousel in the center

3. Copy the generated code

4. Paste into your Bootstrap project