Design system

Agency Grid Layout Minimal

Griglia editoriale multicolonna con titoli fuori scala e minuscole etichette maiuscole.

Che cos’è

Una direzione di layout per siti d’agenzia: gusci di griglia ampi, titoli display fuori scala, piccoli metadati maiuscoli in colonne adiacenti e blocchi immagine architettonici.

Create a minimal agency design system with a disciplined editorial grid, oversized typography, quiet uppercase utility labels, restrained image blocks, and subtle structural detail.
Dal SKILL.md originale

Perché conta per il design

  • Una collocazione rigida delle colonne fa sembrare intenzionale la posizione di ogni elemento.
  • Il contrasto di scala tra titoli display e metadati minuscoli regge la gerarchia.
  • Lo spazio negativo viene preservato invece di riempito, mantenendo la pagina editoriale.

Cosa copre

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

Come installarlo

Agency Grid Layout Minimal

  1. Clona il repository.

    git clone https://github.com/MengTo/Skills
  2. Punta Codex sul file della skill.

    agent-skills/web-design/agency-grid-layout-minimal/SKILL.md
  3. Poi descrivi la UI che vuoi. Codex segue la skill.

Come usarlo con Codex

  1. Imposta prima un guscio ampio a max-width con divisioni di colonna visibili.

  2. Ancora un titolo hero su gran parte delle colonne, il testo di supporto in una colonna laterale.

  3. Costruisci le righe dei servizi come elenchi multicolonna con minuscole etichette di metadati.

Ogni plugin qui è gratuito, open source e rimanda alla sua vera fonte upstream.

Altro sulla lista codex-design ↗

Prossimo passo

Progetta con Open Design, senza il setup

Installa questo plugin da solo, oppure porta attorno a Codex un intero strato di design curato con Open Design. Usa la tua chiave, resta padrone dell’output.

Open Design Desktop

Un solo design system. Il tuo brand, coerente ovunque

Nel Vibe Design Workspace completo, applica le stesse regole di brand a siti, presentazioni, prototipi interattivi, dashboard, immagini e video HTML. Collega Codex, Claude Code, Cursor e gli altri agenti di coding locali e crea gratis.

  • Siti, presentazioni, prototipi, dashboard, immagini e video
  • Oltre 140 design system e la libreria completa di template e skill
  • Codex locale e oltre 21 agenti di coding · Gratis
Scarica gratis

Disponibile per macOS, Windows e Linux