What the Android skill contains
Platform Design Android is the android folder of ehmo's platform-design-skills pack. Its SKILL.md gives an AI coding agent numbered Material Design 3 rules for Jetpack Compose and XML, covering dynamic color, color roles, navigation components, window size classes, edge-to-edge drawing and foldables.
The skill opens with one instruction: enable dynamic color derived from the user's wallpaper, and treat it as the primary theming strategy on Android 12 and later. A Compose theme example and an XML one follow.
Its frontmatter names the triggers: Android UI, Compose components, dynamic color and Material Design compliance. The sections are ranked, with theming and navigation marked CRITICAL and layout and typography marked HIGH.
Where the rules get specific
- A color roles table maps primary, secondary, tertiary, surface, outline and error to their on-colors and the places they belong, such as the navigation bar indicator on secondaryContainer.
- A selection table picks the navigation component from window width: bar, rail or drawer, with 3 to 5 destinations or more.
- Window size classes give compact, medium and expanded widths with 4, 8 and 12 columns.
- Edge-to-edge rules call enableEdgeToEdge before setContent and use WindowInsets for padding.
Compose and XML, side by side
Most rules ship with Kotlin Compose code, and the theming section adds an XML themes file that extends Theme.Material3.DayNight. Teams on older view-based screens get the same guidance as teams on Compose.
Foldables get their own rules: detect the hinge with WindowInfoTracker and keep critical content off the fold. The skill suggests ListDetailPaneScaffold or SupportingPaneScaffold from the Material3 adaptive library.
Who should install it
Good fit
- Android developers whose agent keeps producing iOS-style tab bars or hardcoded colors.
- Reviewers checking a Compose screen against Material Design before merge.
- Teams planning phone, tablet and foldable layouts from one codebase.
Look elsewhere
- Cross-platform Flutter work. Related: Flutter responsive layout guidance.
- Web or iOS screens. This pack ships separate skills for those.
Use it with UiChemy
This skill shapes native Android code and does not touch WordPress. If a mobile design also needs a marketing site, bring the Figma web layout into WordPress with UiChemy. Click Get Started on uichemy.com. Related: mobile design guidance and accessibility fixes.
How to install Platform Design Android: Material Design 3 Rules for Agents
git clone https://github.com/ehmo/platform-design-skills.gitClone the repository
Run the clone command above. The README's own install line uses a skills CLI, so this page uses a plain clone that works with any agent.
Copy the android folder
Take skills/android from the clone. It holds SKILL.md, AGENTS.md, metadata.json and a rules folder with _sections.md.
Place it where your agent reads skills
Put the folder in your agent's skills location. The pack does not state agent folders, so check your tool's documentation.
Ask for a review
The README says skills activate when agents detect platform tasks. Try a prompt such as checking a Compose screen against Material Design.
Check that it loaded
Ask the agent to review one Compose screen against Material Design. The reply should cite dynamic color, color roles or navigation rules by number or name.
Key features
- Dynamic color firstDynamic color from the wallpaper is the default theming strategy on Android 12 and later. The skill shows the Compose scheme selection and the XML theme overlay.
- Color roles tableA table pairs each role with its on-role and its job, from primary and the FAB to outline for borders and inverseSurface for the snackbar.
- Light and dark themesA dedicated section covers light and dark schemes, and another handles custom color seeds when a brand color has to feed the Material palette.
- Navigation componentsRules cover the bottom navigation bar for 3 to 5 destinations, the navigation rail, the navigation drawer and the predictive back gesture on Android 13 and later.
- Component picker by widthA selection table chooses bar, rail, modal drawer or permanent drawer from the compact, medium or expanded window class and the destination count.
- Window size classesCompact under 600dp, medium to 839dp and expanded from 840dp, each with its typical device and column count.
- Material grid valuesMargins, gutters and columns are listed per size class: 16dp margins with 4 columns on compact, 24dp with 8 on medium, 24dp with 12 on expanded.
- Edge-to-edge drawingNumbered rules R3.6 to R3.8 cover enableEdgeToEdge, WindowInsets padding and scrolling behind transparent system bars.
- Foldable supportRules R3.9 and R3.10 cover hinge detection and adaptive pane scaffolds, so critical content never crosses the fold.
- Type scale referenceThe Material type scale opens with displayLarge at 57sp and steps down through headline roles, giving the agent exact sizes instead of guesses.
Frequently asked questions
What does the Android design skill do?
It gives an AI coding agent Material Design 3 rules for Android. The SKILL.md covers Material You theming, navigation, layout and responsive behavior, typography and more, with Jetpack Compose and XML examples, so generated screens follow Google's patterns.
How do I install the Android skill?
The README documents a skills CLI command, which this page does not use. Clone ehmo/platform-design-skills and copy skills/android into the folder your agent loads skills from. The pack states no agent folders, so confirm the path in your agent's docs.
Does it cover Jetpack Compose and XML layouts?
Yes. The frontmatter names both. Compose examples use Kotlin, and the theming section includes an XML example extending Theme.Material3.DayNight with a dynamic color overlay, so view-based projects are not left out.
Which Android versions do the rules mention?
Dynamic color is described as the default on Android 12 and later. Predictive back is described for Android 13 and later, and edge-to-edge enforcement for Android 15 and later. Check those versions against your minSdk before applying a rule.
How does the skill pick a navigation component?
A table maps window size and destination count to a component. Compact width uses a navigation bar for 3 to 5 destinations, medium uses a rail, and expanded uses a rail, or a permanent drawer once there are more than five destinations.
Does it handle foldable devices?
Yes. Rules R3.9 and R3.10 tell the agent to detect the hinge or fold position, avoid placing critical content across it, and use ListDetailPaneScaffold or SupportingPaneScaffold from the Material3 adaptive library for foldable-aware layouts.
Will it work with Claude and other agents?
The README says skills activate automatically when agents detect platform-relevant tasks and does not list supported agents. The folder follows the SKILL.md format with an AGENTS.md file, so Claude or another agent that loads that format should read it. Test with one screen.
What license is the Android skill under?
The repository is MIT licensed according to the GitHub metadata and the README. Keep the license notice if you redistribute the folder inside your own project or share it with a team.