mcpField
M
material-3-skill

material-3-skill

github.com/podo设计与 UI29213 次安装1 天前更新
代码仓库

关于 material-3-skill

material-3-skill 为构建 Android 界面的 Agent 提供 Material Design 3 指导,以 Jetpack Compose 为主,并兼顾 Flutter。

主要功能

  1. 01动态色彩与色调调色板
  2. 0230 多种 Jetpack Compose 组件
  3. 03颜色、字体、形状和高度令牌
  4. 04自适应导航与布局指导
  5. 05动效模式与规范审查
  6. 06附带 Flutter 指导

适用场景

  1. 01使用 Jetpack Compose 构建 Android 界面
  2. 02应用 Material 3 色彩和字体令牌
  3. 03按窗口尺寸类别选择导航方式
  4. 04检查界面是否符合 Material 3 规范

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/podo/design-agent-skills --skill material-3-skill

安装后在 Claude Code 中输入/material-3-skill确认已加载。

附带文件stub.yaml

详细介绍

material-3-skill

目录条目 — 完整技能:hamen/material-3-skill

安装完整技能

将技能克隆或复制到你的 Agent 目录:

全局:

mkdir -p ~/.agents/skills/material-3-skill
curl -fsSL https://raw.githubusercontent.com/hamen/material-3-skill/master/skills/material-3/SKILL.md \
  -o ~/.agents/skills/material-3-skill/SKILL.md

项目:

mkdir -p .agents/skills/material-3-skill
curl -fsSL https://raw.githubusercontent.com/hamen/material-3-skill/master/skills/material-3/SKILL.md \
  -o .agents/skills/material-3-skill/SKILL.md

功能介绍

深入掌握 Google 的 Material Design 3 系统。涵盖:

  • 动态颜色 — ColorScheme.fromSeed、色调调色板生成、浅色 / 深色方案派生
  • 组件库 — Jetpack Compose 中的 30 多种 MD3 组件,并正确绑定令牌
  • 令牌系统 — 颜色角色、字体排印比例、形状比例、海拔 / 色调海拔
  • 布局 — 根据窗口大小类别选择 Scaffold、NavigationBar、NavigationRail 或 NavigationDrawer
  • 动效 — 基于弹簧的动画、共享元素过渡、容器变换
  • 合规性审查 — 用于评估 MD3 符合度的 10 类检查清单
  • Flutter — 使用 ThemeData + useMaterial3: true 提供辅助支持

不适用场景

  • iOS / SwiftUI — 使用 apple-hig-skills 或 liquid-glass-skill
  • 跨平台 HIG 模式 — 使用 platform-design-skills
  • 不使用 Compose 的 Android 设计(XML Views)— 此技能以 Compose 为先

评论

支持 Markdown