Material Design 3

Design, implement, or review Material 3 and Material 3 Expressive interfaces for Android Compose, Android Views, Wear OS, and the web. Use for Material Design, M3, Material You, adaptive Material layouts, Material-focused Android UI modernization, or Material web component work; do not apply it to a non-Material design unless the user asks to adopt Material

12 stars 1 forksMobile Development

Install

skills CLI (Claude Code, Cursor, Codex and more)

npx skills add gdlbo/material-skill --skill material-design-3

Manual install

git clone --depth 1 https://github.com/gdlbo/material-skill.git /tmp/material-skill
mkdir -p ~/.claude/skills
cp -r /tmp/material-skill/. ~/.claude/skills/material-design-3

Personal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.

From the SKILL.md

# Material Design 3

Build a coherent product interface with Material 3 semantics, components, tokens, interaction states, and platform behavior. The target is not a screen that merely looks vaguely Material. It must behave like a good Android or web product and use expression only where it improves hierarchy or comprehension.

## Resolve the Context First

Before changing UI, inspect enough of the project to answer:

- Which target is in scope: Android Compose, Android Views, Wear OS, or web?
- Which Material libraries and versions are already present?
- Is the requested API stable, experimental, or unavailable on that target?
- Which theme, components, navigation model, spacing conventions, and assets already exist?
- What is the screen's primary task, primary action, content hierarchy, and state model?
- Which compact, medium, expanded, desktop, foldable, and input scenarios matter?

Preserve established product identity and architecture. Prefer the existing theme and reusable components unless the task explicitly requests a redesign or migration. Never upgrade a dependency, opt into an alpha release, or migrate Views to Compose as an incidental styling change.

## Read the Relevant Reference

- For visual hierarchy, color, typography, shape, elevation, layout, and component choice, read [references/design-foundations.md](references/design-foundations.md).

Read the full skill on GitHub

Details

Skill name: material-design-3
Repository: gdlbo/material-skill
Repo updated: 21 August 2026

FAQ

What does the Material Design 3 skill do?

How do I install the Material Design 3 skill?

skills CLI (Claude Code, Cursor, Codex and more): npx skills add gdlbo/material-skill --skill material-design-3. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.

Is Material Design 3 popular?

It lives in gdlbo/material-skill, which has 12 GitHub stars and 1 forks.

Related skills

Apple Liquid Glass

xenitV1/liquid-glass-skill

Apple's Liquid Glass design language (iOS 26 / macOS 26 HIG) made buildable on any platform: the content/chrome two-layer model, regular vs clear glass, real refraction (content bending at the rim), the rim light, type scales, system colours, component shapes, and Reduce Motion/Transparency/Increase Contrast fallbacks. Ships a CSS token file and a refraction script for the web, plus routes for SwiftUI/UIKit, Android Compose (Haze), Flutter, Electron, Tauri, Windows and Linux. Use when building or reviewing any UI that should look Apple-made or "liquid glass": "iOS style", "macOS style", "Liqui

Mobile Development

Xml to Compose

singhsume123/xml-to-compose-skill

Convert Android XML layouts to Jetpack Compose. Use when asked to migrate XML layouts, convert views to composables, or help with Compose migration. Handles layouts, widgets, attributes, styles, and resource references.

Mobile Development

IOS Trace

kmgcc/iOS-Trace

Agent-native runbook for evidence-based profiling and optimization of native iOS and iPadOS apps with xctrace and Xcode Instruments on physical devices or simulators. Use for CPU or battery use, memory growth or Jetsam, UI hitches, slow launch, concurrency stalls, audio glitches, or network activity. Choose instruments and workload reproduction to fit the issue; bundled scripts are optional helpers.

Mobile Development

App Store Review

JustinPerea/app-store-review-skill

Pre-submission review for iOS apps targeting the Apple App Store. Scans your Xcode project for common rejection reasons — missing privacy strings, icon issues, entitlement mismatches, missing privacy manifests, account deletion requirements, Sign in with Apple, and more. Use this skill whenever the user wants to check their iOS app before submitting to the App Store, asks about App Store rejection reasons, wants to validate their Xcode project configuration, or mentions anything about App Store review, TestFlight submission, or app approval. Also use when the user mentions Info.plist privacy k

Mobile Development

Android Performance Skill

avinashbest/android-performance-skill

Expert-level Android performance optimization skill. Use this skill whenever the user asks about anything related to Android app performance — including but not limited to: ANRs (Application Not Responding errors), crashes (NullPointerException, OOM, fatal exceptions), app startup time (cold start, warm start, hot start), UI jank or frame drops, memory leaks, battery drain, slow network calls, database/SQLite performance, overdraw, ProGuard/R8, Doze mode, WorkManager, RecyclerView performance, Bitmap/image loading, threading/coroutines, profiling with Android Studio, Perfetto, or Systrace. Tri

Mobile Development

Burner

useburner/burner

Use when the user says "use my burner", "on my burner", "what's on my burner?" (screenshot its screen and send the image), or asks you to do something in a phone app (open an app, tap, type, scroll, check an order). burner gives you a real Android phone the user set aside for you, for apps with no API or website you can automate. Also covers first-time setup.

Mobile Development

Browse the most popular Claude skills, all mobile development skills, or write your own with the skills generator.