Дизайн-системы
Beautiful Shadows
Три готовые Tailwind-утилиты теней для нейтральной слоёной высоты.
Что это
Набор точных произвольных классов теней Tailwind в трёх силах. Каждый наслаивает несколько малопрозрачных нейтральных слоёв вместо дефолтной шкалы теней Tailwind.
Apply exact Tailwind arbitrary shadow utilities for polished, layered neutral elevation. Use when compact cards, controls, panels, popovers, hero media, feature callouts, or modal-like containers need refined shadows wit
Почему это важно для дизайна
- Высота остаётся нейтральной, без цветного свечения, подкрашивающего поверхность под ней.
- Три фиксированные силы соответствуют контролам, карточкам и герой-медиа соответственно.
- Наслоённые малопрозрачные слои читаются как настоящая глубина, а не как одна грубая тень.
Что внутри
- Use when
- Shadow utilities
- Examples
- Usage rules
- Avoid
Как установить
Beautiful Shadows
-
Клонируйте репозиторий.
git clone https://github.com/MengTo/Skills -
Укажите Codex на файл скилла.
agent-skills/web-design/beautiful-shadows/SKILL.md -
Дальше опишите нужный интерфейс. Codex следует скиллу.
Как запустить с Codex
-
Попросите Codex применить утилиту md к карточкам, панелям и поповерам.
-
Оставьте утилиту lg для герой-медиа и контейнеров в духе модалок.
-
Сочетайте каждую тень с чистой заливкой поверхности и единым радиусом.
Каждый плагин здесь бесплатный, с открытым кодом и ссылкой на реальный исходник.
Больше плагинов в списке codex-design ↗Другие дизайн-плагины для Codex
Фронтенд и UI Что он делает gpt-taste Собирает премиальные лендинги в духе award-сайтов: GSAP-анимация скролла и плотные бенто-сетки без пустот. 
Дизайн-системы Что он делает Stitch Design Taste Пишет DESIGN.md, который уводит Google Stitch от шаблонных экранов. 
Фронтенд и UI Что он делает image-to-code Сначала генерирует изображения дизайна, разбирает их, а затем собирает соответствующий фронтенд-код. 
Фронтенд и UI Что он делает imagegen-frontend-mobile Генерирует премиальные флоу экранов мобильного приложения как изображения, а не код. Следующий шаг
Проектируйте с Open Design без возни с настройкой
Поставьте этот плагин сами или разверните вокруг Codex целый кураторский дизайн-слой в Open Design. Свой ключ, свой результат.