layout skills

25 tagged layout, measured the same way as everything else here.

Browse within: design 5

msagljs

01

microsoft/msagljs

Skill Claude CodeCodex

Use MSAGL-JS (Microsoft Automatic Graph Layout) to lay out and visualize networks in JavaScript or TypeScript. Use for graph and network layout, DOT/JSON/JGF parsing, live embedded SVG or WebGL graphs, Sugiyama/MDS/IPSepCola layouts, edge routing, and exporting SVG, PDF, PNG, EPS, or PostScript figures for LaTeX and…

175 13d ago A 87 tokens original MIT

pdf-press

02

kdcube/kdcube

Skill Claude CodeCodex

Teaches agents how to generate Markdown, HTML (with embedded SVG), and Mermaid content that renders beautifully to multi-page PDF via writepdf, with proper page breaks, compact professional layouts, brand and domain-adaptive color schemes, multi-column support for scientific papers, magazine-style editorial documents…

25 2d ago A 74 tokens original MIT

andykear/FileMaker-XMLsnippet-Layout-Claude-Skill

Skill Claude CodeCodex

Use this skill whenever the user wants to work with FileMaker layout XML. This includes generating paste-ready layout object XML (fmxmlsnippet type LayoutObjectList) from descriptions, reviewing layout XML for silent paste-handler failures, or analysing Save as XML layout exports. Trigger any time the user mentions…

12 1mo ago A 133 tokens

ui-design

04

wpank/ai

Skill Claude CodeCodex

Comprehensive UI design skill covering fundamentals, patterns, and anti-patterns. Layout, typography, color, spacing, accessibility, motion, and component design. Use when building any web interface, reviewing design quality, or creating distinctive UIs.

11 6mo ago A 51 tokens

wiremark

05

Blackburn-Labs/wiremark

Skill Claude CodeCodex

Read and write wiremark, the text-based wireframe DSL rendered from fenced wireframe code blocks and .wiremark files. Use when creating, editing, or interpreting wireframes, screen sketches, screen flows, or low-fidelity UI mockups in markdown documents.

4 2mo ago A 56 tokens

connerkward/deterministic-design-skill

Skill Claude CodeCodex

Deterministic, measurable design verification — render the UI and PROVE it's balanced and usable instead of trusting the model's eye. Layout audit (centroid / optical-center / pixel-oracle balance via deterministic math, annotated screenshot) + a vision-judged Nielsen usability audit by a SEPARATE fresh-eyes judge.…

1 2mo ago A 114 tokens copy · 100% MIT

design-spatial

08

connerkward/deterministic-design-skill

Skill Claude CodeCodex

Spatial composition and layout for frontend design. Load with design when composing pages/dashboards/components, or whenever generated UI looks off — overlapping/colliding elements, weak hierarchy, or generic ("looks like every startup site"). The core idea: a model can't trust its own layout, so render it, critique…

1 2mo ago A 0 tokens copy · 100% MIT

design-ux

09

connerkward/deterministic-design-skill

Skill Claude CodeCodex

UX / usability audit — heuristic evaluation of INTERACTIVE UIs (not just visual polish). Load with design when a UI "feels off", "sucks to use", is hard to learn, needs an instruction wall, or before shipping an interactive tool/editor/app. Scores the RENDERED UI against Nielsen's 10 + interaction heuristics via a…

1 2mo ago A 112 tokens copy · 100% MIT