compose-multiplatform-patterns

Document Compose Multiplatform patterns for shared UI across Android, iOS, Desktop, and Web.

Updated Mar 26, 2026
One-click install
npx skills add https://github.com/cescrafli/compyrasion --skill compose-multiplatform-patterns-cescrafli
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: compose-multiplatform-patterns
Source: https://github.com/cescrafli/compyrasion/tree/main/skills/compose-multiplatform-patterns
Command: npx skills add https://github.com/cescrafli/compyrasion --skill compose-multiplatform-patterns-cescrafli

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Compose Multiplatform patterns address the fragmentation of UI development across Android, iOS, Desktop, and Web by providing a cohesive set of patterns for shared state, navigation, theming, and performance.

Core Features & Use Cases

  • State management with a single source of truth using ViewModel, StateFlow, and immutable state objects to drive Compose UIs.
  • Type-safe navigation and modular UI composition for Kotlin Multiplatform and Android projects, including dialog and bottom sheet patterns.
  • Theming and design system guidance, including Material 3 theming and platform-aware UI decisions, with slot-based composables for flexibility.
  • Performance-oriented patterns such as stable data models, correct key usage in lists, derived state, and minimizing allocations.

Quick Start

Create a shared UI module for a multiplatform project by implementing a single-state pattern, type-safe navigation, and platform-specific theming.

Frequently Asked Questions about compose-multiplatform-patterns

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

FAQPage Schema
How do I share state management across Android and iOS using Compose Multiplatform?▼

Share state management across Android and iOS using a single source of truth with ViewModel, StateFlow, and immutable state objects to drive Compose UIs consistently across platforms.

What's the best way to handle navigation in a Kotlin Multiplatform shared UI module?▼

Handle navigation in a Kotlin Multiplatform shared UI module using type-safe navigation patterns, including modular UI composition, dialog, and bottom sheet patterns for Android and iOS.

How do I apply Material 3 theming with platform-aware decisions in Compose Multiplatform?▼

Apply Material 3 theming with platform-aware decisions in Compose Multiplatform by using slot-based composables for flexibility, ensuring the design system adapts correctly across Android, iOS, Desktop, and Web.

Why does my Compose Multiplatform UI have performance issues on large lists?▼

Compose Multiplatform UI performance issues on large lists are resolved by using stable data models, correct key usage in lists, derived state, and minimizing allocations to optimize recomposition.

Can I use Jetpack Compose patterns for Desktop and Web platforms?▼

Jetpack Compose patterns can be used for Desktop and Web platforms, as Compose Multiplatform provides cohesive patterns for theming, navigation, and state management across Android, iOS, Desktop, and Web.

Do I need a shared UI module to implement cross-platform Compose patterns?▼

A shared UI module is needed to implement cross-platform Compose patterns effectively, allowing you to establish a single-state pattern, type-safe navigation, and platform-specific theming across your multiplatform project.