PlugWiki

mobile-android-design Skill for Claude: Material 3 and Jetpack Compose Guidance

mobile-android-design, from wshobson/agents, makes Claude build Android screens with Material Design 3 and Jetpack Compose patterns.

Installs
25.5K
on skills.sh
Stars
42.1K
on GitHub
Files
4
besides SKILL.md
Updated
Oct 2026
last repo commit

mobile-android-design gives Claude a checklist and reference code for Android interfaces built with Material Design 3 (Material You) and Jetpack Compose. It triggers when you design Android screens, write Compose UI, add Navigation Compose, build layouts for phones, tablets and foldables, or work on theming, accessibility and gestures.

The SKILL.md holds a sample Compose card, eight best practices and six common issues. Its core concepts moved into references/details.md, and three more reference files cover navigation, components and theming. The skill bundles no scripts and the SKILL.md names no tools or API keys. It is one skill inside the ui-design plugin of the wshobson/agents repo.

Good for

  • Android developers writing Jetpack Compose screens
  • Designers handing Material 3 specs to Claude to turn into Compose code
  • Teams that want Claude to follow one set of Android navigation and theming rules

Install mobile-android-design

Claude Code

  1. 1

    Copy this prompt.

    Install the mobile-android-design skill in Claude Code. Run this command:

npx skills add https://github.com/wshobson/agents --skill mobile-android-design

Then check that it loaded and tell me how to use it.
  2. 2

    Paste it into Claude Code. It shows the change and asks before running it.

Requires Node.js.

From its listing on skills.sh. Source.

What's in the skill

When it loads

Master Material Design 3 and Jetpack Compose patterns for building native Android apps. Use when designing Android interfaces, implementing Compose UI, or following Google's Material Design guidelines.

Sections in SKILL.md

  1. When to Use This Skill
  2. Detailed section: Core Concepts
  3. Quick Start Component
  4. Best Practices
  5. Common Issues

Key facts

Author
wshobson (GitHub: wshobson)
Repo
wshobson/agents
License
MIT (repo LICENSE, copyright Seth Hobson)
Installs on skills.sh
25,465 as of 2026-11-02
GitHub stars (whole repo)
42,081 as of 2026-11-02
Last repo commit
2026-10-30
Files
5 files including SKILL.md (4 reference guides), no scripts
skills.sh audits
Gen Agent Trust Hub pass, Socket pass, Snyk pass

What it includes

  • Eight triggers for Android UI work

    Designing Android interfaces to Material 3, building Compose UI and layouts, Navigation Compose, adaptive layouts for phones, tablets and foldables, dynamic-color theming, accessible interfaces, gestures, different screen configurations.

    When to use

  • A Compose list card to copy from

    A sample ItemListCard composable: a Card with a rounded 12dp shape, a circular icon, title and subtitle styled from MaterialTheme, and a chevron.

    Quick Start Component

  • Eight rules, e.g. 48dp touch targets and state hoisting

    Use MaterialTheme colors for dark mode, support dynamic color on Android 12+, use WindowSizeClass for adaptive layouts, add contentDescription, keep 48dp touch targets, hoist state, use remember and rememberSaveable properly, add @Preview configurations.

    Best Practices

  • Six pitfalls: recomposition, state loss, leaks

    Unstable lambdas causing recomposition, state loss on configuration change, Column instead of LazyColumn for long lists, missing MaterialTheme wrapper, back-press and deep-link crashes, coroutines not cancelled in DisposableEffect.

    Common Issues

  • Core concepts moved out of SKILL.md

    Material 3 principles, the Compose layout system, navigation patterns, Material 3 theming and component examples.

    references/details.md

  • Navigation Compose, bottom bar, drawer, rail, deep links

    Setup, arguments, bottom navigation with badges, modal and permanent drawers, navigation rail, deep linking, nested navigation, ViewModel integration, back handling and animations.

    references/android-navigation.md

  • Lists, forms, dialogs, loading states, animations

    LazyColumn, pull to refresh, swipe to dismiss, sticky headers, text fields, search bar, selection controls, dialogs, bottom sheets, pickers, skeleton loading and gesture animation.

    references/compose-components.md

  • Color, typography, shapes, elevation, window sizes

    Dynamic color, custom color schemes and roles, the type scale, custom fonts, shapes, tonal elevation, window size classes and foldable support.

    references/material3-theming.md

From the official docs

Questions

What does mobile-android-design do?

It gives Claude Material Design 3 and Jetpack Compose guidance for Android UI. When you ask for Compose screens, navigation or theming, Claude follows its best practices and reference code instead of guessing.

How do I install mobile-android-design in Claude Code?

Use the install box above. The wshobson/agents README says individual skills can be installed with gh skill or the npx skills installer, which skip the plugin's agents, commands and hooks. The README also documents a plugin marketplace route for whole plugins; this page does not cover it.

Does it need an API key or a build tool?

No key or tool is named in the SKILL.md. It bundles four Markdown reference files and no scripts.

Is mobile-android-design safe to install?

It is instructions and example Kotlin code in 5 Markdown files, with no scripts. The navigation guide (references/android-navigation.md) has a setup and dependencies section with Gradle implementation lines, so review any dependency changes Claude makes in your project.

Is it only for native Android?

Its description says it is for building native Android apps with Material Design 3 and Jetpack Compose. Its reference files are about Compose, Navigation Compose and Material 3 theming.

Why does the SKILL.md look short?

The SKILL.md says a 9,201-byte section was moved to references/details.md to fit Codex's 8 KB skill body cap. The full guidance lives in the four reference files.

Information

updated Nov 2, 2026

Repository
wshobson/agents
Folder
plugins/ui-design/skills/mobile-android-design

wshobson/agentsskills.sh

Sources

Docs, issue trackers and discussions this page is built from.

Show all 6
  1. mobile-android-design SKILL.md · github.com
  2. details.md · github.com
  3. wshobson/agents README · github.com
  4. github.com · github.com
  5. github.com · github.com
  6. github.com · github.com

Updated Nov 2, 2026.