AI agent skill for Jetpack Compose & Compose Multiplatform (KMP/CMP). MVI architecture, Navigation 3, Koin/Hilt, Ktor, Room, DataStore, Paging 3, Coil, coroutines/Flow, animations, performance, accessibility, testing, and cross-platform patterns. Works with Codex, Cursor, Claude Code.
$ npx -y skills add Meet-Miyani/compose-skill --agent claude-code
What's inside
This is an AI agent skill — not a library, not documentation. Install it once, and your AI coding agent (Codex, Cursor, Claude Code) gains production-grade knowledge of the entire Compose app development lifecycle: architecture, UI, state, navigation, networking, persistence, performance, accessibility, cross-platform, build configuration, distribution, and code review.
The skill covers Android, iOS, Desktop, and Web targets with the same architectural principles.
| Concern | Without | With |
|---|---|---|
| State management | Scattered mutableStateOf in composables | Single StateFlow<State> owned by ViewModel |
| Business logic | Mixed into UI layer | Isolated in ViewModel's onEvent() handler |
| One-shot actions | Boolean flags in state | Channel<Effect> for navigation, snackbar |
| Recomposition | Frequent, hard to diagnose | Minimized via state shape and read boundaries |
| Navigation | Ad-hoc calls from composables | Semantic effects, route layer executes |
| Networking | Inconsistent error handling | Ktor + Result/ApiResult wrapper, DTO mappers |
| Persistence | Raw SharedPreferences | DataStore + Room with MVI integration |
| Accessibility | Missing or incorrect semantics | contentDescription, touch targets, WCAG contrast |
| Cross-platform | Android-only or inconsistent | commonMain with expect/actual for platform APIs |
| Build config | Hardcoded versions | Version catalog, AGP 9+ patterns, conventions |
| Testing | Manual UI testing | ViewModel event→state→effect via Turbine |
| Code review | Inconsistent patterns | Anti-pattern detection with documented fixes |
Pick your agent and run one command. The clone target becomes the skill folder — agents detect SKILL.md at the root automatically.
Only three things matter for the skill to work:
SKILL.md,agents/, andreferences/. Everything else in this repo (README, LICENSE, scripts, assets, .github) is for documentation, validation, and CI — the agent never reads them. If you prefer a minimal install, you only need those three.
Why is
SKILL.mdat the root? All three agents (Codex, Cursor, Claude Code) look forSKILL.mdat the top level of the skill directory. This repo is structured so that cloning it directly into the skill path gives you a ready-to-use skill — no moving files or extra nesting required.
Skill installation paths may change as agents evolve. The locations below are accurate at the time of writing — for the latest instructions, refer to each agent's official docs or ask your agent "How do I add a skill?"
| Client | User-global | Per-repo |
|---|---|---|
| Codex | ~/.codex/skills/compose-skill | .codex/skills/compose-skill |
| Cursor | ~/.cursor/skills/compose-skill | .cursor/skills/compose-skill |
| Claude Code | ~/.claude/skills/compose-skill | .claude/skills/compose-skill |
| Other agents | Upload SKILL.md, agents/, and references/ as project knowledge | — |
# Replace <path> with the install location from the table above
git clone https://github.com/Meet-Miyani/compose-skill.git <path>
# Examples:
git clone https://github.com/Meet-Miyani/compose-skill.git ~/.cursor/skills/compose-skill
git clone https://github.com/Meet-Miyani/compose-skill.git .codex/skills/compose-skill
| Problem | Fix |
|---|---|
Folder named compose-skill-main | Rename to compose-skill (GitHub ZIP downloads add -main) |
SKILL.md not at root of skill folder | Don't nest inside another directory — clone directly into the skill path |
| Skill not detected after install | Restart the agent / IDE |
| Client | How to verify |
|---|---|
| Codex | Run /skills — compose-skill appears in the list |
| Cursor | Settings → Rules — skill appears under Agent Decides |
| Claude Code | Run /skills or ask "What skills are available?" |
Once installed, the skill activates automatically when your prompt matches its triggers (@Composable, StateFlow, ViewModel, KMP, Ktor, recomposition, DataStore, etc.). You can also invoke it explicitly — the syntax varies by client:
| Client | Explicit invocation | Automatic |
|---|---|---|
| Codex CLI | $compose-skill in your prompt | Yes |
| Codex IDE extension | $compose-skill in chat | Yes |
| Codex App | /compose-skill in chat | Yes |
| Cursor | /compose-skill in Agent chat | Yes |
| Claude Code | /compose-skill in chat | Yes |
Codex CLI / IDE extension — dollar-sign prefix:
$compose-skill Refactor this screen to MVI with proper state modeling.
Codex App / Cursor / Claude Code — slash prefix:
/compose-skill How do I set up Paging 3 with MVI in a KMP project?
compose-skill/
│
│ ## Required (the skill itself) ─────────────────────
├── SKILL.md # Skill definition — agent reads this
├── agents/
│ └── openai.yaml # Codex UI metadata
└── references/ # 37 deep-dive reference files
│ # (loaded on-demand by SKILL.md)
├── architecture.md
├── coroutines-flow.md
├── compose-essentials.md
├── material-design.md
├── image-loading.md
├── lists-grids.md
├── paging.md
├── paging-offline.md
├── paging-mvi-testing.md
├── navigation.md
├── navigation-3.md
├── navigation-2.md
├── navigation-3-di.md
├── navigation-2-di.md
├── navigation-migration.md
├── performance.md
├── animations.md
├── ui-ux.md
├── testing.md
├── room-database.md
├── datastore.md
├── networking-ktor.md
├── networking-ktor-auth.md
├── networking-ktor-testing.md
├── networking-ktor-architecture.md
├── dependency-injection.md
├── koin.md
├── hilt.md
├── cross-platform.md
├── resources.md
├── ios-swift-interop.md
├── accessibility.md
├── clean-code.md
├── anti-patterns.md
├── gradle-build.md
└── ci-cd-distribution.md
│
│ ## Optional (repo extras) ──────────────────────────
├── README.md # This file (not read by agents)
├── LICENSE # MIT License
├── assets/
│ └── compose-multiplatform-icon.svg # Logo for README
└── scripts/
└── validate.sh # Skill scanner / validation tool
The references/ directory contains 37 deep-dive files that the skill loads on-demand. Here's what each one covers in detail:
| Reference | What's Inside |
|---|---|
| coroutines-flow.md | StateFlow vs SharedFlow vs Channel decision table, Flow operators (flatMapLatest, combine, debounce, catch), Dispatchers (IO/Default/Main), structured concurrency (viewModelScope, supervisorScope), exception handling, CancellationException, stateIn/shareIn, backpressure (buffer/conflate/collectLatest), callbackFlow, Mutex/Semaphore, testing with Turbine |
| Reference | What's Inside |
|---|---|
| architecture.md | ViewModel/event-handling pipeline, state modeling, Channel vs SharedFlow for effects, domain layer rules, inter-feature communication (event bus, feature API contracts), module dependency rules, GOOD/BAD code examples |
| clean-code.md | Avoiding overengineering, file organization, naming conventions, disciplined vs bloated MVI comparison |
| anti-patterns.md | Cross-cutting anti-pattern quick-reference table with "why it hurts" and "better replacement" for each, plus routing index to domain-specific anti-patterns in other reference files |
| Reference | What's Inside |
|---|---|
| material-design.md | M3 theme setup (dynamic color, dark/light, color roles), typography/shapes, component decisions (Scaffold, TopAppBar, NavigationBar/Rail/Suite, BottomSheet, Snackbar, Dialog), adaptive layouts (window size classes, canonical layouts), M2→M3 migration |
FAQ
compose-skill is a Claude Code plugin with 1 hand-picked skill for development work, indexed on Flowy. Install it with the command on its page. It includes compose-skill. Its skills do not fire on their own yet. Request auto-invocation to have Flowy route them as you prompt. Free and open source.
Is this plugin yours?
Claim it with GitHubSubmit a pluginPromote it