compose-expert
Compose Expert guides you through creating reusable visual components that work across Android and Desktop platforms. Learn when to share composables in commonMain versus keeping them platform-specific, master state patterns like remember and derivedStateOf, and apply Material3 theming consistently. The skill covers component structure, state hoisting, recomposition optimization, and custom icon creation.
Compose Expert helps you build and share reusable UI components across Android and Desktop using Compose Multiplatform patterns.
AI-generated summary based on this skill's SKILL.md
Decision gist · record as of 2026-07-28
Compose Expert helps you build and share reusable UI components across Android and Desktop using Compose Multiplatform patterns. Compose Expert guides you through creating reusable visual components that work across Android and Desktop platforms. Learn when to share composables in commonMain versus keeping them platform-specific, master state patterns like remember and derivedStateOf, and apply Material3 theming consistently. The skill covers component structure, state hoisting, recomposition optimization, and custom icon creation.
Use it when
- Compose Expert emphasizes building stateless, reusable composables with clear parameter contracts.
- Compose Expert teaches using remember, derivedStateOf, and produceState strategically to avoid redundant recompositions.
Verify before relying
Read SKILL.md below before installing (6 files). Open directory: indexed for reading, not audited.
Install
vitorpamplona/amethyst/compose-expert · repository language: Kotlin
Open directory. Skills are indexed for reading, not audited. Review a skill's body before installing it.
Frequently asked questions
AI-generated answers based on this skill's SKILL.md and metadata
How do I share composables across Android and Desktop?
Compose Expert recommends placing shared UI components in commonMain when they don't require platform-specific APIs. Use expect/actual declarations for platform-specific behavior, and structure composables with state hoisting so business logic remains platform-agnostic. Keep platform-specific navigation and system integration in androidMain and desktopMain modules. This approach maximizes code reuse while respecting platform differences.
What are compose multiplatform UI components best practices?
Compose Expert emphasizes building stateless, reusable composables with clear parameter contracts. Apply state hoisting to lift state management above UI layers, use @Stable and @Immutable annotations to prevent unnecessary recomposition, and structure components around Material3 theming for consistency. Test composables in isolation by providing all required state as parameters, making them predictable across platforms.
How should I optimize recomposition and state management?
Compose Expert teaches using remember, derivedStateOf, and produceState strategically to avoid redundant recompositions. Mark data classes with @Immutable and @Stable to help the compiler optimize comparisons. Implement the "state down, events up" pattern where parent composables manage state and children receive callbacks. Use lazy lists efficiently and avoid capturing mutable state in closures.
When should I use commonMain versus platform-specific UI?
Compose Expert advises sharing composables in commonMain when they're purely visual and don't depend on platform APIs. Keep navigation, system dialogs, and platform-specific layouts in androidMain or desktopMain. Use expect/actual for components requiring platform behavior, and delegate platform-specific concerns through callback parameters passed from platform modules.
How do I apply Material3 theming in multiplatform Compose?
Compose Expert guides defining Material3 ColorScheme, Typography, and Shapes in commonMain, then wrapping shared composables in a custom theme composable. Use platform-specific theme implementations in androidMain and desktopMain to handle system preferences or platform conventions. This ensures visual consistency while respecting each platform's design guidelines and user expectations.
What's the best way to create custom ImageVector icons?
Compose Expert recommends defining custom ImageVector icons in commonMain using the vector builder DSL, then caching them in objects to avoid recreation. For platform-specific icons, use expect/actual to provide platform-native implementations. Structure icon sets as reusable composables that accept size, tint, and content description parameters for accessibility and flexibility.
SKILL.md
Rendered from the published skill. Quoted content, verbatim.
Compose Multiplatform Expert
Visual UI patterns for sharing composables across Android and Desktop.
When to Use This Skill
- Creating or refactoring shared UI components
- Deciding whether to share UI in
commonMainor keep platform-specific - Building custom ImageVector icons (robohash pattern)
- State management: remember, derivedStateOf, produceState
- Recomposition optimization: visual usage of @Stable/@Immutable
- Material3 theming and styling
- Performance: lazy lists, image loading
Delegate to other skills:
- Navigation structure → android-expert, desktop-expert
- Kotlin state patterns (StateFlow, sealed classes) →
(truncated - see the full file via the links below)
File tree — 6 files
.claude/skills/compose-expert/SKILL.md
.claude/skills/compose-expert/references/icon-assets.md
.claude/skills/compose-expert/references/rich-text-parsing.md
.claude/skills/compose-expert/references/shared-composables-catalog.md
.claude/skills/compose-expert/references/state-patterns.md
.claude/skills/compose-expert/scripts/find-composables.sh
Let your AI agent find skills like this
Example. Real query, live index.
You found this page by searching. An agent finds it by wishing: SkillFed indexes 56,283 agent skills by what they can do, searchable in plain language.
wish › “Build and share reusable UI components across Android and Desktop platforms”
Give your agent the search over MCP, or paste the wish link into any chat. No install? Search from any chat →
Related skills
Compose Expert is a specialized assistant for developers building UIs with Compose and Compose Multiplatform. It covers state management, animations, layouts, navigation, paging, theming, and design-to-code workflows across Android, iOS, Desktop, and Web platforms. The skill activates on Compose API mentions, design system questions, and GitHub PR reviews.
Learn to craft responsive Android interfaces using Jetpack Compose and Material Design 3 (Material You). This skill covers adaptive layouts for phones, tablets, and foldables, dynamic color theming, and accessibility best practices.
Styles guides you through adopting Jetpack Compose's Styles API for custom UI components and themes. Follow step-by-step workflows to upgrade dependencies, establish ComponentStyles, and migrate components using Modifier.styleable to replace hard-coded styling parameters with unified style attributes.
Master patterns for building shared UI with Compose Multiplatform and Jetpack Compose across multiple platforms. Covers state management with ViewModels, type-safe navigation, reusable composable design, platform-specific implementations, and recomposition optimization.
Master Android development using Kotlin and Jetpack Compose for declarative UI building. Learn clean architecture patterns, dependency injection with Hilt, Room database integration, and Retrofit API calls across phones, tablets, TV, Wear OS, and Android Auto.
This skill leverages Persona Control Language (PCL) to deliver specialized Kotlin mentorship, covering everything from language fundamentals to advanced Android patterns and asynchronous programming with coroutines. Get personalized recommendations and solutions that adapt to your experience level and project needs.
More skills compose-slot-api-pattern (MIT) · kotlin-multiplatform (MIT) · kotlin-multiplatform (MIT) · android-design-guidelines (MIT) · Android Design (NOASSERTION) · compose-modifier-and-layout-style (Apache-2.0)