From oma
Defines and manages DESIGN.md for design systems, enforces anti-patterns, guides components. Covers typography, colors, motion (motion/react, GSAP, Three.js), responsive layouts, WCAG 2.2 accessibility.
npx claudepluginhub first-fluke/oh-my-agent --plugin omaThis skill uses the workspace's default tool permissions.
Design specialist that defines, creates, and validates project design systems.
Generates DESIGN.md files for Google Stitch screen generation with premium typography, color palettes, layouts, motion intents, and anti-generic UI rules.
Provides 68 pre-built DESIGN.md files to scaffold full UI design systems in Claude Design, generating CSS tokens, type scales, component previews, HTML kits, and SKILL.md files.
Generates design system from product domain: style, palette, typography, platform patterns. Outputs .rune/design-system.md as contract for UI skills.
Share bugs, ideas, or general feedback.
Design specialist that defines, creates, and validates project design systems. DESIGN.md is the central artifact — all design work revolves around it.
DESIGN.md, visual direction, typography, color, motion, accessibility, anti-pattern review, or component guidance.DESIGN.mdoma-frontendoma-pmoma-qa.design-context.md, DESIGN.md, screenshots, references, or component constraintsDESIGN.md, audit findings, component guidance, or handoff notes.design-context.md and DESIGN.md.design-context.md; if missing, run setup before design work.DESIGN.md and related guidance..design-context.md is missing, create it before continuing.| Action | SSL primitive | Evidence |
|---|---|---|
| Read design context | READ | .design-context.md, DESIGN.md, references |
| Select design direction | SELECT | 2-3 directions and recommended option |
| Infer visual system | INFER | Typography, color, layout, motion |
| Call optional tooling | CALL_TOOL | Stitch/getdesign/shadcn when relevant |
| Write design artifact | WRITE | DESIGN.md or audit output |
| Validate design quality | VALIDATE | Checklist, WCAG, anti-patterns |
| Report handoff | NOTIFY | Final design summary |
1. Check `.design-context.md`; create it if missing.
2. Produce 2-3 design directions and get confirmation.
3. Generate or revise `DESIGN.md`, then run the design checklist.
Optional vendor seed discovery:
bunx getdesign@latest list
| Scope | Resource target |
|---|---|
LOCAL_FS | .design-context.md, DESIGN.md, design resources |
CODEBASE | Existing UI and component patterns |
NETWORK | Optional getdesign/vendor references |
PROCESS | Optional CLI/tool invocations |
DESIGN.md and design context artifacts..design-context.md before any design work. If missing, run Phase 1 (Setup) to create it.system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif). Add custom fonts only with project justification.resources/anti-patterns.md.prefers-reduced-motion.7 phases: Setup → Extract → Enhance → Propose → Generate → Audit → Handoff.
See resources/execution-protocol.md for full detail.
Phase 2 can optionally seed from the community
getdesign catalog
(VoltAgent/awesome-design-md,
MIT). Trigger it by listing a supported vendor domain in the
## Reference Sites section of your .design-context.md:
## Reference Sites
- [linear.app](https://linear.app) — clean dark UI, minimal, professional
- [stripe.com](https://stripe.com) — strong hierarchy, purposeful animation
Any domain that matches a brand in the getdesign manifest triggers an
automatic fetch + hash-verify + load during Phase 2. No new fields, no
extra config. Full vendor list: see bunx getdesign@latest list
(telemetry is always disabled by oma-design).
Seed, not final. oma-design treats vendor templates as inspiration and synthesizes a project-specific DESIGN.md around them. Importantly:
Attribution is appended to the generated DESIGN.md in Phase 7 as a
required MIT compliance footer. Full fetcher rules, matching algorithm,
injection defenses, and multi-vendor merge policy live in
resources/getdesign-fetcher.md.
resources/execution-protocol.md — 7-phase workflowresources/anti-patterns.md — Full DO/DON'T catalogresources/checklist.md — Audit checklist (Responsive + WCAG + Nielsen + Slop)resources/design-md-spec.md — DESIGN.md generation guide (9 sections)resources/design-tokens.md — CSS/Tailwind/shadcn export templatesresources/prompt-enhancement.md — Vague request → detailed specresources/stitch-integration.md — Stitch MCP tool mapping (optional)resources/getdesign-fetcher.md — Vendor seed fetch, hash verify, seed rulesresources/error-playbook.md — Design error recoveryreference/visual-hierarchy.md — 7 hierarchy principles (Alignment, Color, Contrast, Proximity, Size, Texture, Time)reference/typography.md — Font selection, type scale, CJKreference/color-and-contrast.md — Color psychology, WCAG contrastreference/spatial-design.md — 8px grid, breakpoints, spacingreference/motion-design.md — motion/react, GSAP, Three.js, ogl, Temporal UXreference/responsive-design.md — Mobile-first, theme systemreference/component-patterns.md — shadcn/Aceternity/React Bits catalogreference/accessibility.md — WCAG 2.2, ARIA, focus, reduced-motionreference/shader-and-3d.md — WebGL, R3F, ogl, performanceexamples/design-context-example.md — .design-context.md exampleexamples/landing-page-prompt.md — Detailed landing page prompt