Avalonia/samples/ControlCatalog/Pages/CarouselPage/CarouselMultiItemPage.xaml

<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             x:Class="ControlCatalog.Pages.CarouselMultiItemPage">
  <DockPanel>
    <ScrollViewer DockPanel.Dock="Right" Width="260">
      <StackPanel Margin="12" Spacing="8">
        <TextBlock Text="Configuration" FontWeight="SemiBold" FontSize="16"
                   Foreground="{DynamicResource SystemControlHighlightAccentBrush}" />

        <TextBlock Text="Navigation" FontWeight="SemiBold" FontSize="13" />
        <Button x:Name="PreviousButton" Content="Previous" HorizontalAlignment="Stretch" />
        <Button x:Name="NextButton" Content="Next" HorizontalAlignment="Stretch" />

        <Separator />

        <TextBlock Text="Viewport Fraction" FontWeight="SemiBold" FontSize="13" />
        <TextBlock TextWrapping="Wrap" FontSize="11" Opacity="0.6"
                   Text="Values below 1.0 show adjacent items peeking into the viewport." />
        <Grid ColumnDefinitions="*,48" ColumnSpacing="8">
          <Slider x:Name="ViewportSlider"
                  Minimum="0.2" Maximum="1.0" Value="0.5"
                  TickFrequency="0.01" IsSnapToTickEnabled="True"
                  HorizontalAlignment="Stretch"
                  ValueChanged="OnViewportFractionChanged" />
          <TextBlock x:Name="ViewportLabel" Grid.Column="1"
                     Text="0.50" VerticalAlignment="Center"
                     HorizontalAlignment="Right" FontWeight="SemiBold" />
        </Grid>
        <TextBlock x:Name="ViewportHint"
                   Text="~2 items visible."
                   FontSize="11" Opacity="0.6" TextWrapping="Wrap" />

        <Separator />

        <TextBlock Text="Options" FontWeight="SemiBold" FontSize="13" />
        <CheckBox x:Name="WrapCheck" Content="Wrap Selection" IsChecked="False"
                  IsCheckedChanged="OnWrapChanged" />
        <CheckBox x:Name="SwipeCheck" Content="Swipe / Drag" IsChecked="True"
                  IsCheckedChanged="OnSwipeChanged" />

        <Separator />

        <TextBlock Text="Status" FontWeight="SemiBold" FontSize="14" />
        <TextBlock x:Name="StatusText" Text="Item: 1 / 5"
                   Opacity="0.7" TextWrapping="Wrap" />
      </StackPanel>
    </ScrollViewer>

    <Border DockPanel.Dock="Right" Width="1"
            Background="{DynamicResource SystemControlForegroundBaseMediumLowBrush}" />

    <Border Margin="12"
            BorderBrush="{DynamicResource SystemControlForegroundBaseMediumLowBrush}"
            BorderThickness="1" CornerRadius="6" ClipToBounds="True">
      <Carousel x:Name="DemoCarousel"
                Height="280"
                ViewportFraction="0.5"
                IsSwipeEnabled="True">
        <Carousel.PageTransition>
          <PageSlide Duration="0.3" Orientation="Horizontal" />
        </Carousel.PageTransition>

        <Border Margin="6,12" CornerRadius="14" ClipToBounds="True">
          <Border.Background>
            <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
              <GradientStop Color="#3525CD" Offset="0" />
              <GradientStop Color="#6B5CE7" Offset="1" />
            </LinearGradientBrush>
          </Border.Background>
          <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center" Spacing="8">
            <TextBlock Text="01" FontSize="52" FontWeight="Bold" Foreground="White"
                       HorizontalAlignment="Center" LetterSpacing="-2" />
            <TextBlock Text="Neon Pulse" FontSize="15" FontWeight="SemiBold"
                       Foreground="#C3C0FF" HorizontalAlignment="Center" />
          </StackPanel>
        </Border>

        <Border Margin="6,12" CornerRadius="14" ClipToBounds="True">
          <Border.Background>
            <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
              <GradientStop Color="#0891B2" Offset="0" />
              <GradientStop Color="#06B6D4" Offset="1" />
            </LinearGradientBrush>
          </Border.Background>
          <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center" Spacing="8">
            <TextBlock Text="02" FontSize="52" FontWeight="Bold" Foreground="White"
                       HorizontalAlignment="Center" LetterSpacing="-2" />
            <TextBlock Text="Ephemeral Blue" FontSize="15" FontWeight="SemiBold"
                       Foreground="#BAF0FA" HorizontalAlignment="Center" />
          </StackPanel>
        </Border>

        <Border Margin="6,12" CornerRadius="14" ClipToBounds="True">
          <Border.Background>
            <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
              <GradientStop Color="#059669" Offset="0" />
              <GradientStop Color="#10B981" Offset="1" />
            </LinearGradientBrush>
          </Border.Background>
          <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center" Spacing="8">
            <TextBlock Text="03" FontSize="52" FontWeight="Bold" Foreground="White"
                       HorizontalAlignment="Center" LetterSpacing="-2" />
            <TextBlock Text="Forest Forms" FontSize="15" FontWeight="SemiBold"
                       Foreground="#A7F3D0" HorizontalAlignment="Center" />
          </StackPanel>
        </Border>

        <Border Margin="6,12" CornerRadius="14" ClipToBounds="True">
          <Border.Background>
            <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
              <GradientStop Color="#D97706" Offset="0" />
              <GradientStop Color="#F59E0B" Offset="1" />
            </LinearGradientBrush>
          </Border.Background>
          <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center" Spacing="8">
            <TextBlock Text="04" FontSize="52" FontWeight="Bold" Foreground="White"
                       HorizontalAlignment="Center" LetterSpacing="-2" />
            <TextBlock Text="Golden Hour" FontSize="15" FontWeight="SemiBold"
                       Foreground="#FDE68A" HorizontalAlignment="Center" />
          </StackPanel>
        </Border>

        <Border Margin="6,12" CornerRadius="14" ClipToBounds="True">
          <Border.Background>
            <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
              <GradientStop Color="#BE185D" Offset="0" />
              <GradientStop Color="#EC4899" Offset="1" />
            </LinearGradientBrush>
          </Border.Background>
          <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center" Spacing="8">
            <TextBlock Text="05" FontSize="52" FontWeight="Bold" Foreground="White"
                       HorizontalAlignment="Center" LetterSpacing="-2" />
            <TextBlock Text="Crimson Wave" FontSize="15" FontWeight="SemiBold"
                       Foreground="#FBCFE8" HorizontalAlignment="Center" />
          </StackPanel>
        </Border>
      </Carousel>
    </Border>
  </DockPanel>
</UserControl>