Фронтенд и UI
Border Gradients
Добавляет выверенный градиентный край карточкам, модалкам и герой-поверхностям.
Что это
CSS-рецепт для деликатных градиентных рамок через наслоение padding-box и border-box, плюс вариант с маскированным псевдоэлементом для поверхностей со сложным фоном.
Apply subtle gradient-border treatments for premium web surfaces. Use when cards, pricing panels, nav bars, modals, buttons, or hero surfaces need a refined edge highlight without a loud glow.
Почему это важно для дизайна
- Даёт премиальную проработку края без крикливого свечения неоновых рамок.
- Маскированный вариант сохраняет существующий фон, а не перезаписывает его.
- Дефолты держат стопы ниже 0.4 непрозрачности, поэтому рамки обрамляют, а не соперничают.
Что внутри
- Use when
- Defaults
- Simple CSS pattern
- Masked pattern
- Tailwind shortcut
- Taste rules
Как установить
Border Gradients
-
Клонируйте репозиторий.
git clone https://github.com/MengTo/Skills -
Укажите Codex на файл скилла.
agent-skills/web-design/css-border-gradient/SKILL.md -
Дальше опишите нужный интерфейс. Codex следует скиллу.
Как запустить с Codex
-
Направьте Codex на карточку или тарифную панель, которой нужен край получше.
-
Выберите простой паттерн для сплошных заливок, маскированный для сложных фонов.
-
Проверяйте светлую и тёмную темы по отдельности, ведь альфа редко переносится.
Каждый плагин здесь бесплатный, с открытым кодом и ссылкой на реальный исходник.
Больше плагинов в списке 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. Свой ключ, свой результат.