Дизайн-системы
Material 3
Реализует Material Design 3 от Google в Compose, Flutter и вебе.
Что это
Гайд по Material Design 3, покрывающий пространство токенов md.sys, 30+ компонентов, адаптивную раскладку, темизацию и M3 Expressive. Jetpack Compose основная цель; Flutter и @material/web вторичны.
>
Почему это важно для дизайна
- Токены цвета, шрифта, формы и высоты заменяют захардкоженные hex и радиусы.
- Тональные поверхности несут глубину вместо теней, в согласии с текущей спецификацией MD3.
- Оценочный аудит рейтингует десять категорий и перечисляет правки по приоритету.
Что внутри
- Design token system
- Component quick reference
- Common patterns
- Anti-patterns
- M3 Expressive
- MD3 compliance audit
Как установить
Material 3
-
Клонируйте репозиторий.
git clone https://github.com/hamen/material-3-skill -
Укажите Codex на файл скилла.
skills/material-3/SKILL.md -
Дальше опишите нужный интерфейс. Codex следует скиллу.
Как запустить с Codex
-
Назовите платформу, чтобы Codex выбрал Compose, Flutter или кастомные свойства CSS.
-
Запросите компонент и получите правильный вариант вместе с проводкой токенов.
-
Прогоните аудит по URL или исходным файлам ради отчёта о соответствии.
Каждый плагин здесь бесплатный, с открытым кодом и ссылкой на реальный исходник.
Больше плагинов в списке codex-design ↗Следующий шаг
Проектируйте с Open Design без возни с настройкой
Поставьте этот плагин сами или разверните вокруг Codex целый кураторский дизайн-слой в Open Design. Свой ключ, свой результат.