Jetpack Compose Expert
aldefy/compose-skill
Guides Jetpack Compose and Compose Multiplatform work across Android, Desktop, iOS and web, plus Android TV, Material 3 motion, paging, navigation and design-to-code.
Guides writing correct, performant Compose and Compose Multiplatform UI across Android, desktop, iOS and web, from state and animation to design-to-code and crash fixes.
$ npx skills add rcosteira79/android-skills --skill compose -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install rcosteira79/android-skills compose --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/rcosteira79/android-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/android-skills/skills/compose .claude/skills/compose && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "compose" agent skill from https://github.com/rcosteira79/android-skills/tree/main/plugins/android-skills/skills/compose into .claude/skills/compose/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "compose", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/rcosteira79/android-skills/tree/main/plugins/android-skills/skills/composeType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add rcosteira79/android-skills --skill compose -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install rcosteira79/android-skills compose --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/rcosteira79/android-skills.git skills-src && mkdir -p .agents/skills && cp -r skills-src/plugins/android-skills/skills/compose .agents/skills/compose && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "compose" agent skill from https://github.com/rcosteira79/android-skills/tree/main/plugins/android-skills/skills/compose into .agents/skills/compose/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "compose", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add rcosteira79/android-skills --skill compose -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install rcosteira79/android-skills compose --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/rcosteira79/android-skills.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/plugins/android-skills/skills/compose .cursor/skills/compose && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "compose" agent skill from https://github.com/rcosteira79/android-skills/tree/main/plugins/android-skills/skills/compose into .cursor/skills/compose/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "compose", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/rcosteira79/android-skills.git --path plugins/android-skills/skills/compose--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add rcosteira79/android-skills --skill compose -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install rcosteira79/android-skills compose --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/rcosteira79/android-skills.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/plugins/android-skills/skills/compose .gemini/skills/compose && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "compose" agent skill from https://github.com/rcosteira79/android-skills/tree/main/plugins/android-skills/skills/compose into .gemini/skills/compose/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "compose", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install rcosteira79/android-skills composeInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add rcosteira79/android-skills --skill compose -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/rcosteira79/android-skills.git skills-src && mkdir -p .github/skills && cp -r skills-src/plugins/android-skills/skills/compose .github/skills/compose && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "compose" agent skill from https://github.com/rcosteira79/android-skills/tree/main/plugins/android-skills/skills/compose into .github/skills/compose/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "compose", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add rcosteira79/android-skills --skill compose -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install rcosteira79/android-skills compose --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/rcosteira79/android-skills.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/plugins/android-skills/skills/compose .opencode/skills/compose && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "compose" agent skill from https://github.com/rcosteira79/android-skills/tree/main/plugins/android-skills/skills/compose into .opencode/skills/compose/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "compose", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
composeGuides writing correct, performant Compose and Compose Multiplatform UI across Android, desktop, iOS and web, from state and animation to design-to-code and crash fixes.
The agent first works out which Compose layer is involved (runtime, UI, foundation, Material3 or navigation), whether the problem is state, layout, performance or architecture, and whether the code is Android-only or multiplatform. When you share a Figma frame or screenshot, it decomposes the design into a composable tree, transcribes copy and values exactly, and maps colors and spacing to MaterialTheme tokens and CompositionLocals.
Advice is grounded in reference files that are read before answering, covering state management, side effects, modifiers, lists and scrolling, animation, navigation, accessibility, focus handling for D-pad and TV remotes, performance, platform specifics, deprecated patterns and a production crash playbook. The guidance is described as non-opinionated and based on analysis of the androidx and JetBrains Compose source code.
5 steps, taken from the step headings in SKILL.md.
Read from SKILL.md and the folder at commit 0f9af5a. It shows what the files ask for, not the result of running them.
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Shell commands in SKILL.md call:
ghFrom the folder's file list and the shell code blocks in SKILL.md.
Hosts in commands or code, which the agent is likely to contact:
raw.githubusercontent.comandroid.googlesource.comFrom URLs in SKILL.md, links to its own repository left out.
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Jetpack Compose and Multiplatform Expert loads about 2.6k tokens when it runs, and up to ~41k if it reads all its reference files. Until then it costs about 238 tokens; SKILL.md has 737 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
The full file from rcosteira79/android-skills at commit 0f9af5a, republished under its MIT licence (© rcosteira79). 737 words, ~2,555 tokens.
.claude/skills/compose/SKILL.md (or your agent's skills folder). This skill also uses 21 other files; get the full folder from GitHub.Non-opinionated, practical guidance for writing correct, performant Compose code —
across Android, Desktop, iOS, and Web. Covers Jetpack Compose and Compose Multiplatform.
Backed by analysis of actual source code from androidx/androidx and
JetBrains/compose-multiplatform-core.
When helping with Compose code, follow this checklist:
references/design-to-compose.mdreferences/design-to-compose.md)references/animation.md (contentKey, phase rule, M3 motion tokens), references/animation-recipes.md (shimmer/loading-crossfade + choreography), or references/animation-advanced.md (shared-element, predictive back, drawBehind-for-color)Read the relevant reference file(s) from references/ before answering:
| Topic | Reference File |
|---|---|
State-hoisting boundary (UI-value-drives-business-logic), derivedStateOf-capture trap, cross-phase back-writing, durable-state-over-events, @ReadOnlyComposable | references/state-management.md |
Slot / content-API authoring — receiver scopes (RowScope), optional (nullable) slots, XxxDefaults, slot-vs-boolean-flag | references/view-composition.md |
| Screen/content split (private content composable), framework-state-stays-in-UI (not hoisted to the ViewModel) | references/screen-structure.md |
| Modifier-as-API-contract rules (no hardcoded placement on a reusable root, caller-modifier-first) + chain ordering | references/modifiers.md |
Effects (LaunchedEffect/DisposableEffect/SideEffect), lifecycle effects (LifecycleResumeEffect), effect anti-patterns | references/side-effects.md |
compositionLocalOf vs staticCompositionLocalOf (recomposition scope), custom locals, no-mutable-State-in-a-local | references/composition-locals.md |
LazyList perf traps — indexOf()-O(n²), no-new-objects-in-key, animateItem, ReportDrawnWhen, infinite-scroll trigger | references/lists-scrolling.md |
Navigation 3 (NavDisplay, back-stack-as-state, compose-shape guardrails); type-safe @Serializable routes | references/navigation.md |
AnimatedContent contentKey-on-shape, defer-reads-to-latest-phase (lambda modifiers), M3 motion/easing tokens | references/animation.md |
| Animation recipes (shimmer/loading-crossfade), sequential/parallel/staggered choreography | references/animation-recipes.md |
Shared-element transitions (sharedBounds/sharedElement/skipToLookaheadSize), drawBehind-for-animated-color, predictive back | references/animation-advanced.md |
Extending the theme beyond M3's three slots — custom design tokens via CompositionLocal | references/theming-material3.md |
| Touch targets, spacing, canonical layouts, foldables, M3 compliance audit | android-skills:android-ux |
| Recomposition skipping, stability, baseline profiles, benchmarking | references/performance.md |
Traversal order (traversalIndex / isTraversalGroup), live-region mode (Polite vs Assertive) | references/accessibility.md |
FocusRequester, focusable(), focusProperties, key events, D-pad, TV, keyboard, focus restoration | references/focus-navigation.md |
| Removed/replaced APIs, migration paths from older Compose versions | references/deprecated-patterns.md |
Styles API (experimental): Style {}, MutableStyleState, Modifier.styleable() | references/styles-experimental.md |
Transcribing a design — exact copy/casing/number format, exact-token-vs-near-neighbour, missing-token-added-not-substituted, export-over-render as source of truth; Figma dropShadow/innerShadow (1.9+, chain placement), spacing/elevation design-token CompositionLocal | references/design-to-compose.md |
| Production crash patterns, defensive coding, state/performance rules | references/production-crash-playbook.md |
CMP gotchas (collectAsState-in-commonMain, commonMain @Preview package, Lottie→Kottie, compiler-stability-non-JVM) + Android-only→CMP migration | references/multiplatform.md |
| Desktop (Window, Tray, MenuBar), iOS (UIKitView), Web (ComposeViewport) | references/platform-specifics.md |
When referencing Compose internals, point to the exact source file:
// See: compose/runtime/runtime/src/commonMain/kotlin/androidx/compose/runtime/Composer.ktCompose thinks in three phases: Composition → Layout → Drawing. State reads in each phase only trigger work for that phase and later ones.
Recomposition is frequent and cheap — but only if you help the compiler skip unchanged scopes. Use stable types, avoid allocations in composable bodies.
Modifier order matters. Modifier.padding(16.dp).background(Color.Red) is visually
different from Modifier.background(Color.Red).padding(16.dp).
State should live as low as possible and be hoisted only as high as needed. Don't put everything in a ViewModel just because you can.
Side effects exist to bridge Compose's declarative world with imperative APIs. Use the right one for the job — misusing them causes bugs that are hard to trace.
Compose Multiplatform shares the runtime but not the platform. UI code in
commonMain is portable. Platform-specific APIs (LocalContext, BackHandler,
Window) require expect/actual or conditional source sets.
Always verify against live source code — never rely on training data alone.
android-sources MCP serverWhen available, use the MCP tools for fast, precise lookups:
lookup_class(className: "LazyListState")
lookup_method(className: "Composer", methodName: "startRestartGroup")
search_in_source(query: "fun rememberLazyListState")
list_class_members(className: "Modifier")
get_class_hierarchy(className: "LazyListState")
find_references(className: "SnapshotState", methodName: "value")If the MCP server is unavailable, fetch source directly:
https://raw.githubusercontent.com/androidx/androidx/androidx-main/{path}gh api repos/androidx/androidx/contents/{path}https://raw.githubusercontent.com/JetBrains/compose-multiplatform-core/jb-main/{path}https://android.googlesource.com/platform/frameworks/base/+/refs/heads/main/{path}?format=TEXT (base64)references/state-management.md)androidx/androidx (branch: androidx-main)
├── compose/runtime/runtime/src/commonMain/kotlin/androidx/compose/runtime/
├── compose/ui/ui/src/androidMain/kotlin/androidx/compose/ui/platform/
├── compose/ui/ui/src/commonMain/kotlin/androidx/compose/ui/
├── compose/foundation/foundation/src/commonMain/kotlin/androidx/compose/foundation/
├── compose/material3/material3/src/commonMain/kotlin/androidx/compose/material3/
└── compose/navigation/navigation-compose/src/commonMain/kotlin/androidx/navigation/compose/
compose-multiplatform-core (branch: jb-main)
├── compose/ui/ui/src/desktopMain/kotlin/androidx/compose/ui/window/
├── compose/ui/ui/src/iosMain/kotlin/androidx/compose/ui/window/
├── compose/ui/ui/src/webMain/kotlin/androidx/compose/ui/window/
├── compose/ui/ui/src/skikoMain/kotlin/androidx/compose/ui/
└── compose/foundation/foundation/src/skikoMain/kotlin/androidx/compose/foundation/
compose-multiplatform (resources library)
└── components/resources/library/src/commonMain/For guidance, best practices, or migration guides — things source code alone can't answer — prefer Google's Android Knowledge Base over web search:
android docs search "LazyColumn performance" # ranked kb:// URLs + summaries
android docs fetch kb://android/develop/ui/compose/lists # full content of a result4800+ curated docs across Android, Wear, TV, KMP, and Glance. Use this when the internal files in references/ don't cover your question; use source code lookups (above) when you need implementation details rather than guidance.
© rcosteira79, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
SKILL.md and 21 other files (references) in plugins/android-skills/skills/compose of rcosteira79/android-skills.
Open the folder on GitHubat commit 0f9af5a
Jetpack Compose and Multiplatform Expert next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Jetpack Compose and Multiplatform Expert this skillrcosteira79/android-skills | 150 | — | ~2.6k | Automated safety check: Pass | MIT | |
| Jetpack Compose Expertaldefy/compose-skill | 596 | — | ~4.8k | Automated safety check: Pass | Custom licence | |
| Compose Multiplatform Patternsmonta-app/ocpp-emulator | 179 | 5 repos | ~2k | Automated safety check: Pass | Apache-2.0 | |
| Ksafeioannisa/KSafe | 332 | — | ~17k | Automated safety check: Pass | Apache-2.0 | |
| KtormonitorCosminMihuMDC/KtorMonitor | 254 | — | ~2.5k | Automated safety check: Pass | Apache-2.0 | |
| Compose Multiplatformericrisco/rsc-harness | 156 | — | ~2.7k | Automated safety check: Pass | MIT |
aldefy/compose-skill
Guides Jetpack Compose and Compose Multiplatform work across Android, Desktop, iOS and web, plus Android TV, Material 3 motion, paging, navigation and design-to-code.
monta-app/ocpp-emulator
Compose Multiplatform and Jetpack Compose patterns for KMP projects — state management, navigation, theming, performance, and platform-specific UI.
ioannisa/KSafe
Required before any reply that touches KSafe (by ksafe(...), ksafe.get/put, :ksafe-compose, :ksafe-biometrics), even a 'can KSafe do X?' question or a one-line change that looks like plain Kotlin.
CosminMihuMDC/KtorMonitor
KtorMonitor is a Kotlin Multiplatform library for real-time HTTP traffic monitoring.
ericrisco/rsc-harness
A skill your agent uses when building one shared Compose UI in Kotlin across Android, iOS, and desktop — commonMain @Composables, expect/actual, source-set placement, native interop, multiplatform…
Drjacky/claude-android-ninja
Build and migrate Android apps with Kotlin, Jetpack Compose, MVVM, Hilt, Room 3 (KSP, SQLiteDriver, Flow/suspend DAOs), Navigation3, and multi-module Gradle.
rcosteira79/android-skills
Helps choose how common Kotlin Multiplatform code reaches platform APIs: expect/actual, a common interface with platform bindings, or separate platform screens.
rcosteira79/android-skills
Sets out the repository pattern's error-propagation model for Android and Kotlin Multiplatform, plus the Room setup for commonMain.
rcosteira79/android-skills
Android and KMP debugging techniques for crashes, ANRs, memory leaks, R8 traces, Gradle failures and Compose recomposition, built on finding the root cause first.
rcosteira79/android-skills
Sets house defaults for Android and Kotlin Multiplatform work and routes to the right specialized skill for Compose, networking, testing or build tooling.
rcosteira79/android-skills
Sets up Android Gradle convention plugins in a build-logic composite build, including the version catalog wiring and shared configuration that are easy to get wrong.
rcosteira79/android-skills
A skill your agent uses when setting up or working with Retrofit in Android — service interface definitions, coroutines integration, OkHttp configuration, Hilt module setup, and error handling in…
Works with
Categories
Guides writing correct, performant Compose and Compose Multiplatform UI across Android, desktop, iOS and web, from state and animation to design-to-code and crash fixes. The agent first works out which Compose layer is involved (runtime, UI, foundation, Material3 or navigation), whether the problem is state, layout, performance or architecture, and whether the code is Android-only or multiplatform. When you share a Figma frame or screenshot, it decomposes the design into a composable tree, transcribes copy and values exactly, and maps colors and spacing to MaterialTheme tokens and CompositionLocals.
Jetpack Compose and Multiplatform Expert fits situations like: fixing a slow or over-recomposing Compose screen; building a Compose screen from a Figma design or screenshot; sharing UI code between Android and iOS with Compose Multiplatform; working out why a LaunchedEffect or remember call misbehaves.
Run `npx skills add rcosteira79/android-skills --skill compose -a claude-code`. Or copy the skill folder (plugins/android-skills/skills/compose in rcosteira79/android-skills) into .claude/skills/compose in your project. Claude Code loads it when a task matches its description.
Run `npx skills add rcosteira79/android-skills --skill compose -a codex`. Or copy the skill folder (plugins/android-skills/skills/compose in rcosteira79/android-skills) into .agents/skills/compose in your project. Codex loads it when a task matches its description.
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add rcosteira79/android-skills --skill compose -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/compose, .gemini/skills/compose, .github/skills/compose and .opencode/skills/compose in your project.
Going by SKILL.md and its folder, Jetpack Compose and Multiplatform Expert needs the command-line tools its instructions call (gh).
SKILL.md names 2 domains. In commands or code: raw.githubusercontent.com and android.googlesource.com; the agent is likely to contact these when it follows the instructions. This is read from the text; nothing was executed.
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
Jetpack Compose and Multiplatform Expert is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
About 2.6k tokens (SKILL.md is roughly 10k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 39k tokens, read only when the agent opens those files.
Skills that share tags, products or a category with Jetpack Compose and Multiplatform Expert: Jetpack Compose Expert (aldefy/compose-skill, 596 stars), Compose Multiplatform Patterns (monta-app/ocpp-emulator, 179 stars), Ksafe (ioannisa/KSafe, 332 stars) and Ktormonitor (CosminMihuMDC/KtorMonitor, 254 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
rcosteira79 (a GitHub user) maintains it in rcosteira79/android-skills, which has 150 GitHub stars. The repository holds 21 skills in this directory. The repository was last updated on September 19, 2026.
Source: rcosteira79/android-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.