Дизайн-системы

Agency Grid Layout Minimal

Редакционная многоколоночная сетка с огромными заголовками и крошечными подписями капсом.

Что это

Направление раскладки для сайтов агентств: широкие сеточные оболочки, огромные заголовки, мелкие метаданные капсом в соседних колонках и архитектурные блоки изображений.

Create a minimal agency design system with a disciplined editorial grid, oversized typography, quiet uppercase utility labels, restrained image blocks, and subtle structural detail.
Из исходного SKILL.md

Почему это важно для дизайна

  • Строгое размещение по колонкам делает позицию каждого элемента прочитанной как намеренная.
  • Контраст масштаба между крупными заголовками и крошечными метаданными несёт иерархию.
  • Негативное пространство сохраняется, а не заполняется, что держит страницу редакционной.

Что внутри

  • Scope
  • Visual target
  • Implementation guidance
  • Recommended patterns
  • Tuning knobs
  • Avoid

Как установить

Agency Grid Layout Minimal

  1. Клонируйте репозиторий.

    git clone https://github.com/MengTo/Skills
  2. Укажите Codex на файл скилла.

    agent-skills/web-design/agency-grid-layout-minimal/SKILL.md
  3. Дальше опишите нужный интерфейс. Codex следует скиллу.

Как запустить с Codex

  1. Сначала задайте широкую оболочку с большим max-width и видимыми делениями колонок.

  2. Закрепите герой-заголовок на большинстве колонок, а вспомогательный текст в боковой колонке.

  3. Собирайте ряды услуг как многоколоночные списки с крошечными подписями-метаданными.

Каждый плагин здесь бесплатный, с открытым кодом и ссылкой на реальный исходник.

Больше плагинов в списке codex-design ↗

Следующий шаг

Проектируйте с Open Design без возни с настройкой

Поставьте этот плагин сами или разверните вокруг Codex целый кураторский дизайн-слой в Open Design. Свой ключ, свой результат.