skills.rest
nirajrathod19
nirajrathod19COMMUNITY
Explore all skills by this author →
GitHub

design

Generate React Vite frontends and refine designs through specialized subagents.

Updated Aug 4, 2025
Search Tags:#design#ui#frontend#react#generation#subagent
One-click install
npx skills add https://github.com/nirajrathod19/Inlytix_BI --skill design-nirajrathod19
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design
Source: https://github.com/nirajrathod19/Inlytix_BI/tree/main/.local/skills/design
Command: npx skills add https://github.com/nirajrathod19/Inlytix_BI --skill design-nirajrathod19

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill streamlines the process of creating and refining user interfaces, from initial frontend generation to detailed design iterations.

Core Features & Use Cases

  • Initial Frontend Generation: Quickly scaffold a complete React frontend using generateFrontend().
  • Design Iterations & Refinements: Utilize a specialized design subagent for visual adjustments, image generation, and complex design tasks.
  • Use Case: After generating the initial frontend for a web application, use the design subagent to refine the color palette, update typography, and create custom illustrations for key sections.

Quick Start

Generate a new React Vite frontend for the 'artifacts/web-app' directory with a clean minimal design style.

Frequently Asked Questions about design

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

FAQPage Schema
How do I generate a React frontend from scratch?▼

To generate a React frontend, use the generateFrontend() function to scaffold an initial UI structure quickly. The output is a complete frontend setup in your target directory, ready for further development and design refinements.

What's the best way to iterate on UI design after initial frontend generation?▼

To iterate on UI design, utilize the specialized design subagent for visual adjustments. This subagent handles detailed design modifications like refining color palettes, updating typography, and generating custom illustrations for key sections.

Can I use this to generate custom images and illustrations for my web application?▼

Yes, you can generate custom images and illustrations for your web application. The design subagent integrates with media generation tools, allowing you to create custom visual assets directly during the frontend design refinement process.

Does this frontend scaffolding tool support asynchronous execution?▼

Yes, the frontend scaffolding tool supports both synchronous and asynchronous execution. This allows you to handle complex frontend generation and detailed design modifications without blocking other development tasks.

What file operations are available for frontend design tasks?▼

For frontend design tasks, the tool provides access to standard file operations alongside code execution tools and web search. This integration supports comprehensive design workflows, enabling direct modifications and asset management within your project files.

Related Skills

Explore More Design & Creative Skills→
liminal-ailiminal-ai
1

convex-quickstart

Scaffold Convex projects and wire ConvexProvider with environment variables.

Official
Intermediate
DiologIRDiologIR

acceptance-e2e

Automate end-to-end UI tests for web applications using Playwright.

Official
Advanced
shahmirerrorshahmirerror

design

Delegate frontend design tasks to a specialized subagent for iteration and polish.

Community
Intermediate
hajrasarwar11hajrasarwar11

design

Delegate frontend design tasks to a specialized subagent for iterative refinements.

Community
Intermediate