material-3

Material Design 3 Skill

Version 1.1.1 · released 2026-06-29 — Fixes Claude Code installation by shipping a plugin marketplace manifest; documents the working install commands.

A comprehensive skill for AI coding assistants that can load SKILL.md files, covering Google's Material Design 3 (Material You) UI system.

---

What's new

1.1.1 — 2026-06-29

Fixed — Claude Code installation.

• The repo now ships a plugin marketplace manifest at .claude-plugin/marketplace.json and moves the plugin manifest to skills/material-3/.claude-plugin/plugin.json. Previously the documented claude plugin install github:hamen/material-3-skill failed with "not found in any configured marketplace" (#8).
• Documented the install paths that actually work — npx skills and the Claude Code marketplace flow (see Installation).
• Migration: if you installed (or tried to) with the old claude plugin install github:hamen/material-3-skill command, reinstall with one of the commands in Installation.

Read the full release notes: v1.1.1.

1.1.0 — 2026-05-20

Updated — Google I/O 2026 Material guidance.

• Added notes from What’s new at Google I/O 2026: Expressive layout/scaffold, the 8dp spacing system, watch/XR form factors, expressive lists and menus, Compose-first Material Android, and expressive search/search app bar.

Read the full release notes: v1.1.0.

1.0.0 — 2026-05-20

Added — portable skill packaging.

• Claude Code one-command install: install directly with claude plugin install github:hamen/material-3-skill.
• Portable skill layout: the skill now lives at skills/material-3/SKILL.md, with references under skills/material-3/references/.
• Plugin manifest: .claude-plugin/plugin.json declares the material-3 plugin metadata for Claude Code while keeping the skill content usable by other skill-aware assistants.

Superseded in 1.1.1. The claude plugin install github:… command above never worked and the plugin manifest has moved — use the current commands in Installation.

Read the full release notes: v1.0.0.

---

Table of contents

• What's new
• What it does
• Platform support
• How this skill was built
  • Sources
  • Process
  • What this means for accuracy
• Installation
• Usage
  • Build MD3 components
  • Generate a theme
  • Scaffold an app
  • Audit MD3 compliance
• What's included
• Contributing
• License

What it does

• Guides AI coding assistants in generating MD3-compliant UI with correct design tokens, components, theming, layout, and accessibility
• Primary focus: Jetpack Compose — MaterialTheme, Material 3 composables, adaptive layouts, edge-to-edge/insets, and current Compose Material3 patterns
• Also covers Flutter (useMaterial3, ColorScheme.fromSeed, etc.) at a secondary level
• Web (@material/web) is documented as a limited path: Material Web is in maintenance mode and M3 Expressive is not implemented on Web; use tokens and components knowing the ecosystem is not receiving active feature work
• Covers 30+ components with Compose-oriented mappings plus web element names where applicable, attributes, and examples in skills/material-3/references/component-catalog.md
• Includes an MD3 compliance audit mode that scores apps across 10 categories (works for Compose/Kotlin, Flutter/Dart, and web/CSS)
• Covers M3 Expressive plus the Google I/O 2026 layout/component updates — see SKILL.md, layout-and-responsive.md, and typography-and-shape.md

Platform support

Platform	Role in this skill	Notes
Jetpack Compose	Primary	Best match for current Material 3 implementation APIs, Expressive motion where available, adaptive navigation
Flutter	Secondary	ThemeData(useMaterial3: true), ColorScheme.fromSeed, community packages for dynamic color
Web	Limited	@material/web + CSS custom properties; maintenance mode; no full Expressive parity

How this skill was built