NewPower Apps · canvas componentNavigation and layout✓ Tested in StudioMIT License
Carousel
Slides from a table, each a picture or a colour with a title and text, advancing on a timer with a pause control, dots and arrows, looping or stopping at the end; OnChange and OnSelect, Next, Previous, GoTo, Play and Pause; light and dark, each slide fading in.
Set the same ones in Studio to try it the same way; there, each Notify shows its event in a banner, which this preview leaves out so nothing covers the component. The instance names are the ones Studio gives the first copy on a screen.
lcsCarousel_1.OnChange=Notify("Slide " & Index & ", " & Key)
lcsCarousel_1.OnSelect=Notify("Selected slide " & Index & ", " & Key)
A web replica that behaves as the component does in Power Apps. In Studio it uses Microsoft's controls, which can look slightly different.
Add it in five steps
1In Power Apps Studio, open Settings > Updates and check that Modern controls and themes and Enhanced component properties are on.
2Open the Components tab in the tree view and select New component.
3Select an empty part of Studio, so the new component isn't selected.
4Copy the YAML on this page and press Ctrl+V. lcsCarousel appears with all its properties.
5On a screen, insert it from Insert > Custom > lcsCarousel.
What it needs
No premium licence: standard controls, no connectors
Modern controls and themes: on
Enhanced component properties: on
Tested in Power Apps Studio 3.26101.10 on October 13, 2026
Version 0.1.0
Properties (21)
Read from the component's own YAML, so they always match what you paste.
Inputs
Property
Kind
Type
Default
Items
The slides, as a table with Key, Title, Text, Image (a picture URL, or empty) and Color (a hex used behind the text when there's no picture) columns.
Input
Table
Table({Key: "welcome", Title: "Welcome to the facilities app", Text: "Raise a request, track it, and see what's booked, all in one place.", Image: "", Color: "#0f6cbd"}, {Key: "rooms", Title: "Book a room in two taps", Text: "Pick a room, pick a time. Projector and chairs come with it.", Image: "", Color: "#7c3aed"}, {Key: "help", Title: "Something broken?", Text: "Photograph it and send it. The desk replies within the hour.", Image: "", Color: "#0e7490"})
AutoPlay
Advances the slides by itself. People can pause it; a screen reader user should be able to, so leave the pause control on.
Input
Boolean
true
Interval
How long each slide stays, in milliseconds, when AutoPlay is on.
Input
Number
5000
Loop
Goes back to the first slide after the last. Off, it stops at the last and the next arrow is disabled.
Input
Boolean
true
ShowDots
Shows a dot per slide under the picture; each is a button to that slide.
Input
Boolean
true
ShowArrows
Shows the previous and next arrows.
Input
Boolean
true
ShowPause
Shows the pause and play control when AutoPlay is on.
Input
Boolean
true
ShowCaptions
Shows each slide's title and text over its lower part.
Input
Boolean
true
AccentColor
Your brand colour, for the current dot and the focus rings.
Input
Color
RGBA(15, 108, 189, 1)
Theme
Light, or Dark for a dark screen.
Input
Text
"Light"
Motion
A slide fades in when it arrives. None plays for people who've asked their device for reduced motion; the slides still change.
Input
Boolean
true
Outputs
Property
Kind
Type
Default
CurrentIndex
The slide showing now, 1 for the first.
Output
Number
—
CurrentKey
The Key of the slide showing now.
Output
Text
—
IsPlaying
True while the slides advance by themselves.
Output
Boolean
—
Events
Property
Kind
Type
Default
OnChange(Key, Index)
Runs in your app when the slide changes, by the timer or by a person.
Key (Text): The new slide's Key.
Index (Number): The new slide's position, 1 for the first.
Event
—
false
OnSelect(Key, Index)
Runs in your app when the slide itself is selected, to open what it's about.
Key (Text): The slide's Key.
Index (Number): The slide's position, 1 for the first.
Event
—
false
Actions
Property
Kind
Type
Default
Next()
Goes to the next slide, or the first after the last when Loop is on.
Action
—
—
Previous()
Goes to the slide before, or the last from the first when Loop is on.
Action
—
—
GoTo(Index)
Goes to a slide by position, 1 for the first.
Index (Number): The slide's position.
Action
—
—
Play()
Starts advancing the slides by the timer.
Action
—
—
Pause()
Stops the timer; the slides stay until a person moves them.
Action
—
—
Guide
Use lcsCarousel for a welcome tour on first run, announcements at the top of a home screen, or a few featured items. Canvas apps have no carousel; the usual build is a gallery turned sideways with no timer, no dots and nothing for a screen reader. This component is the real thing, with the parts that make an auto-advancing banner acceptable:
Slides from a table of Key, Title, Text, Image (a picture URL) and Color (a fill behind the text when there's no picture);
A timer that advances the slides (AutoPlay, Interval), a pause control so people can stop it, and arrows or dots that stop it when a person takes over;
Dots that are buttons to each slide ("Slide 2: Book a room, current") and arrows that disable at the ends when Loop is off;
OnChange(Key, Index) when the slide changes and OnSelect(Key, Index) when the slide itself is tapped; Next, Previous, GoTo, Play and Pause from your app;
Each slide fades in, and the caption sits over a gradient so white text reads on any picture.
The examples call it crsHome at the top of the home screen.
Announcements from a Dataverse table, the newest three:
// dlgConfirm.OnOpen (or wherever you show it)
crsHome.Pause()
Columns.Items wants exactly Key, Title, Text, Image and Color; RenameColumns and ShowColumns get them from any table, as in Use it. An image column needs a URL the app can load; for a Dataverse image column, use its full-size URL from the record, or store pictures in Blob Storage with a SAS and pass the link.
Keep it short. Three to five slides is a banner; past that, it's a list, and people won't wait for the timer.
Pictures. 16 by 9 looks right at the default 480 by 270; the picture is shown with Fill, so the edges of a different shape are cropped, not stretched.
The slide is one button named "Slide 2 of 3: Book a room in two taps. Pick a room, pick a time…", so a screen reader hears the slide's words; the dots are buttons named by slide and "current"; the arrows and the pause control are named. Tab reaches them all; Enter and Space act.
Auto-advancing content needs a way to stop it: the pause control is on by default when AutoPlay is, and using an arrow or a dot stops the timer too. Keep Interval at five seconds or more so there's time to read.
The caption sits over a dark gradient, so white text keeps its contrast on a light picture.
With Motion on, a slide fades in over under half a second; none plays for people who've asked their device for reduced motion, and the slides still change on the timer. For people who've asked for less motion, consider AutoPlay off.
In Power Apps Studio, timers run only in preview (F5); in the published app, the timer always runs. Test the auto-advance with the app playing.
The timer resets when it ends, not when a person moves a slide, so after an arrow or a dot the next automatic advance can come sooner than Interval. Arrows and dots pause the timer; Play() starts it again.
A picture is loaded from its URL each time its slide shows; keep pictures small, or use a colour.
One slide shows at a time; there's no peek at the next one and no swipe.
0.1.0: first version: slides from a table, the timer with pause, dots and arrows, Loop, captions over a gradient, OnChange, OnSelect, Next, Previous, GoTo, Play, Pause, the outputs, light and dark, the fade motion.
Did it work for you?
No ratings yet.Nobody has said it worked in their app yet.
Sign in to rate it or to say it worked in your app.
Comments
LowCodeStacks teamPinned
Welcome! A tip: in Studio the timer only runs in preview (F5), so play the app to see it advance. And keep the pause control on whenever AutoPlay is; a banner that can't be stopped fails the accessibility check, and people hate it anyway.
What are you putting in it: a welcome tour, announcements, featured items? Tell us how many slides and what interval feels right to your people.