Run any Skill in Manus with one click

stitch-design

Stars3

Forks0

UpdatedApril 20, 2026 at 16:25

Headless Stitch CLI / MCP skill for automated UI/UX design and rendering. Orchestrates responsive layouts across all breakpoints (mobile, tablet, desktop, large screens) with zero-overlap navigation and atomic design exports.

Installation

Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.

Run Skill in Manus

Source

d-oit

d-oit/do-knowledge-studio

View GitHub Repository View Creator Repositories

Download

Run Skill in Manus

Related occupationsSOC

Based on SOC occupation classification

Web and Digital Interface DesignersComputer and Mathematical Occupations·SOC 15-1255

File Explorer

2 files

SKILL.md

readonly

name	stitch-design
version	0.1.0
description	Headless Stitch CLI / MCP skill for automated UI/UX design and rendering. Orchestrates responsive layouts across all breakpoints (mobile, tablet, desktop, large screens) with zero-overlap navigation and atomic design exports.

Stitch Design Skill

Headless Stitch CLI / MCP skill for automated UI/UX design and rendering. Use this skill when you need to design or redesign a UI feature based on a requirement or issue.

Triggers

/jules-design
"design a new UI"
"create responsive layout"
"generate design specs"

Capabilities

Responsive Architecture: Generates UI variants across mobile, tablet, desktop, and large screens.
Zero-Overlap Navigation: Enforces self-learning navigation patterns with no overlapping elements.
Atomic Design Exports: Outputs design specs to the design/ folder:
- design/layout.md
- design/typography.md
- design/color-palette.md
- design/DESIGN.md (overall architecture)
Code Rendering: Renders initial component code directly into the repository's frontend directory.

Constraints

Always use the stitch CLI or MCP server for design generation.
Ensure all designs adhere to the project's design tokens and accessibility standards.
Output MUST include atomic markdown files in the design/ directory.

Integration

Works in tandem with jules-implement for implementation and delta-based research.
Aligns with ui-ux-optimize for token DNA and swarm-based refinement.

More from this repository

same repository

memory-context

d-oit/do-knowledge-studio

Retrieve semantically relevant past learnings and analysis outputs using the csm CLI (HDC encoder with hybrid BM25 retrieval)

2026-07-243

test-runner

d-oit/do-knowledge-studio

Execute tests, analyze results, and diagnose failures across any testing framework. Use when running test suites, debugging failing tests, or configuring CI/CD testing pipelines.

2026-07-243

turso-db

d-oit/do-knowledge-studio

Use this skill for Turso (LibSQL/Limbo) database development, including scaffolding, querying, migrations, and maintenance. Supports vector search, full-text search, CDC, MVCC, encryption, and bidirectional remote sync. Use when working with Turso SDKs for JavaScript, Rust, Python, Go, and React Native. Provides current API guidance to avoid stale "libsql" legacy knowledge.

2026-07-243

atomic-commit

d-oit/do-knowledge-studio

Atomic git workflow - validates, commits, pushes, creates PR, and verifies CI with zero-warnings policy. Orchestrates complete code submission as state machine with rollback on failure.

2026-07-143

code-review-assistant

d-oit/do-knowledge-studio

Automated code review with PR analysis, change summaries, and quality checks. Use for reviewing pull requests, generating review comments, checking against best practices, and identifying potential issues. Includes style guide compliance, security issue detection, and review automation.

2026-07-143

git-github-workflow

d-oit/do-knowledge-studio

Unified atomic git workflow with GitHub integration - commits all changes, checks GitHub issues, creates PR, validates all Actions pass including pre-existing, uses swarm coordination with web research on failures. Post-merge validation of all files and docs.

2026-07-143

name	stitch-design
version	0.1.0
description	Headless Stitch CLI / MCP skill for automated UI/UX design and rendering. Orchestrates responsive layouts across all breakpoints (mobile, tablet, desktop, large screens) with zero-overlap navigation and atomic design exports.

Stitch Design Skill

Headless Stitch CLI / MCP skill for automated UI/UX design and rendering. Use this skill when you need to design or redesign a UI feature based on a requirement or issue.

Triggers

/jules-design
"design a new UI"
"create responsive layout"
"generate design specs"

Capabilities

Responsive Architecture: Generates UI variants across mobile, tablet, desktop, and large screens.
Zero-Overlap Navigation: Enforces self-learning navigation patterns with no overlapping elements.
Atomic Design Exports: Outputs design specs to the design/ folder:
- design/layout.md
- design/typography.md
- design/color-palette.md
- design/DESIGN.md (overall architecture)
Code Rendering: Renders initial component code directly into the repository's frontend directory.

Constraints

Always use the stitch CLI or MCP server for design generation.
Ensure all designs adhere to the project's design tokens and accessibility standards.
Output MUST include atomic markdown files in the design/ directory.

Integration

Works in tandem with jules-implement for implementation and delta-based research.
Aligns with ui-ux-optimize for token DNA and swarm-based refinement.