skills.rest
andrewle9510
andrewle9510COMMUNITY
Explore all skills by this author →
GitHub

frontend-design

Delegate frontend design tasks to specialized expert skills and synthesize unified recommendations.

Updated Jan 17, 2026
Search Tags:#components#UI#Next.js#Tailwind#design-system#orchestrate#frontend-design
One-click install
npx skills add https://github.com/andrewle9510/design-skill-orchestrator --skill frontend-design-andrewle9510
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-design
Source: https://github.com/andrewle9510/design-skill-orchestrator/tree/main/.opencode/skill/frontend-design
Command: npx skills add https://github.com/andrewle9510/design-skill-orchestrator --skill frontend-design-andrewle9510

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

The Frontend Design Orchestrator identifies user design requests, analyzes required expert domains, and delegates work to specialized skills to deliver cohesive UI outcomes.

Core Features & Use Cases

  • Intent-driven delegation: Understands user goals and routes tasks to color, typography, spacing, components, and patterns experts.
  • Unified orchestration: Coordinates multiple design domains (philosophy, color systems, typography, layout, components, accessibility) to produce consistent UI guidance.
  • Use Case: A user asks to redesign a dashboard UI; the orchestrator engages the relevant experts to propose color theme, typography scale, component variations, and layout options, then synthesizes a final plan.

Quick Start

Use the frontend-design skill to initialize a UI overhaul by describing the desired pages, components, and interactions.

Frequently Asked Questions about frontend-design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I orchestrate a complete frontend design system for a Next.js and Tailwind UI?▼

Frontend design orchestration works by analyzing your UI request and routing it to specialized expert domains for color, typography, spacing, and components. It then synthesizes their outputs into a cohesive visual design recommendation for your pages.

Can I use this to redesign a dashboard UI with shadcn UI components?▼

Yes, you can redesign a dashboard UI with shadcn UI. The orchestrator engages relevant experts to propose a color theme, typography scale, layout options, and component variations, synthesizing them into a final unified UI plan.

What's the best way to coordinate multiple frontend design domains like typography and spacing?▼

The best way to coordinate frontend design domains is through intent-driven delegation. This skill routes your typography, spacing, and component requirements to dedicated experts and synthesizes their outputs into a consistent, unified design recommendation.

Do I need to manually manage color systems and layout patterns when building a UI?▼

No, you do not need to manually manage color systems and layout patterns. The orchestrator automatically coordinates these design domains by delegating to specialized experts, ensuring consistent visual design and accessibility without manual routing.

Related Skills

Explore More Design & Creative Skills→
priyansh19priyansh19
1

design-guide

Establish and enforce CrewSpace UI design system standards across frontend components.

Community
Advanced
AsyrafHussinAsyrafHussin
62

tailwind-best-practices

Enforce consistent Tailwind CSS patterns for breakpoints, colors, typography, and components.

Community
Intermediate
TNHoang2708TNHoang2708
1

ck:ui-styling

Integrate shadcn/ui components and Tailwind CSS for accessible responsive interfaces.

Community
Advanced
projectedanxprojectedanx
1

concept-diagrams

Generates standalone HTML files with minimal SVG diagrams for educational and technical use.

Community
Intermediate