Search packages, repositories and app categories

m3_carousel cover
Package detailsv2.1.5

m3_carousel

A flutter implementation of the Material Design 3 carousel (https://m3.material.io/components/carousel/overview).

AndroidiOSWebmacOSWindowsLinux
30-day downloads
940
Likes
45
Pub points
160

Install package

flutter pub add m3_carousel

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

A Flutter package that implements the Material Design 3 carousel, offering a modern, interactive, and visually appealing way to display content in a horizontal scrollable layout. Inspired by the official M3 guidelines, it supports smooth animations, responsive design, and intuitive user interactions across all major platforms. The carousel is ideal for showcasing images, cards, or product listings with depth and motion effects. It integrates seamlessly into Flutter apps and follows Material Design 3 principles for consistency and accessibility.

Use cases

  • Displaying image galleries
  • Showcasing product highlights
  • Presenting featured content
  • Creating interactive onboarding screens
  • Building dynamic card-based interfaces

Key features

  • Material Design 3 compliant
  • Smooth horizontal scrolling
  • Depth and motion effects
  • Responsive layout
  • Platform-agnostic support
  • Customizable item appearance

Suitable for

  • Apps needing modern UI components
  • Designers following M3 guidelines
  • Developers building media-rich interfaces
  • Cross-platform mobile and web apps
  • Projects emphasizing visual engagement

Considerations

  • May require performance tuning for large datasets
  • Limited customization for non-M3 styling
  • Best suited for moderate-sized content lists
  • Requires careful handling of touch gestures on small screens
  • Not optimized for vertical carousels

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

M3_Carousel

A flutter implementation of the Material Design 3 carousel. Built on the CarouselView.

Feature Highlights

  • Hero carousel with support for "left", "center" and "right" alignments.

  • Contained carousel. Extended view inclusive.

  • Uncontained carousel.

  • Horizontal or vertical scrolling via axis.

Installing

In your pubspec.yaml

dependencies:
  m3_carousel: ^2.1.4 # requires Dart => ^3.12.0, Flutter >=3.38.0

Usage

import "package:m3_carousel/m3_carousel.dart";

M3Carousel(
    type: CarouselType.hero,
    heroAlignment: HeroAlignment.center,
    axis: Axis.horizontal,
    onTap: (int tapIndex) => log(tapIndex.toString()),
    children: List<Widget>.generate(10, (int index) {
        return ColoredBox(
            color: Colors.primaries[index % Colors.primaries.length]
                .withValues(alpha: 0.8),
            child: const SizedBox.expand(),
        );
    }),
),

See example/lib/main.dart for complete examples.

Reference

Use of CarouselView is govern by the Flutter Authors LICENSE

License

MIT license

Categories

Dependencies

Dependency list 3 items

Source repository

Projects using this package

No data available yet.