m3-expressive

Implement Material 3 Expressive UI patterns in Android Jetpack Compose.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/iFor-Lux/LuxuryCheats --skill m3-expressive
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: m3-expressive
Source: https://github.com/iFor-Lux/LuxuryCheats/tree/main/.agents/skills/m3-expressive
Command: npx skills add https://github.com/iFor-Lux/LuxuryCheats --skill m3-expressive

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Android developers often struggle to implement Material 3 Expressive designs in Jetpack Compose with cohesive theming, motion, and new components across screens. This skill provides a practical, ready-to-use approach to build expressive UIs that align with Material Design 3 Expressive guidelines.

Core Features & Use Cases

  • MotionScheme: Spring-based animation system for expressive interactions and hero moments
  • MaterialShapes: 35 shapes with morphing transitions for dynamic components
  • New Components: LoadingIndicator, ButtonGroup, FloatingActionButtonMenu, FloatingToolbar, Carousel
  • Theming: MaterialExpressiveTheme with color, typography, shapes, and motionScheme for end-to-end UI consistency
  • Use Case: Prototype a polished app UI with expressive micro-interactions and adaptive theming for API 24+ devices

Quick Start

  1. Add dependencies for Material 3 Expressive and opt-in to ExperimentalMaterial3ExpressiveApi if required.
  2. Wrap your app with MaterialExpressiveTheme and select MotionScheme.expressive() for animations.
  3. Leverage MaterialShapes to craft morphing components and incorporate new UI elements like LoadingIndicator and ButtonGroup.

Frequently Asked Questions about m3-expressive

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I implement Material 3 Expressive theming in Jetpack Compose?▼

Implement Material 3 Expressive theming in Jetpack Compose by wrapping your app with MaterialExpressiveTheme to apply cohesive color, typography, shapes, and MotionScheme across all screens.

What is the MotionScheme in Material 3 Expressive and how does it work?▼

MotionScheme in Material 3 Expressive is a spring-based animation system that enables expressive interactions and hero moments by applying dynamic spring physics to UI components.

How do I create shape morphing transitions for Android components?▼

Create shape morphing transitions by leveraging MaterialShapes, which provides 35 distinct shapes with morphing capabilities for building dynamic Jetpack Compose components.

What new UI components are available in Material 3 Expressive for Android?▼

New Material 3 Expressive UI components for Android include LoadingIndicator, ButtonGroup, FloatingActionButtonMenu, FloatingToolbar, and Carousel for building interactive app screens.

Does Material 3 Expressive work with older Android API levels?▼

Material 3 Expressive supports Android API 24 and above, allowing you to build Jetpack Compose apps with expressive theming and components that run on a wide range of devices.

Do I need to opt-in to experimental APIs to use Material 3 Expressive components?▼

You must opt-in to ExperimentalMaterial3ExpressiveApi to use Material 3 Expressive components, requiring a standard Android project setup with Kotlin and Jetpack Compose dependencies.