skills.rest
KRISHNA0R
KRISHNA0RCOMMUNITY
Explore all skills by this author →
GitHub

ui-setup

Automate StyleSeed UI project setup with token and scaffold generation.

25|6|Updated Apr 20, 2026
Search Tags:#ui#scaffold#setup#brand#tokens#design-system
One-click install
npx skills add https://github.com/KRISHNA0R/PORTFOLIOv2 --skill ui-setup-krishna0r
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-setup
Source: https://github.com/KRISHNA0R/PORTFOLIOv2/tree/main/.agents/skills/ui-setup
Command: npx skills add https://github.com/KRISHNA0R/PORTFOLIOv2 --skill ui-setup-krishna0r

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Automates the initial UI project setup by collecting branding, app context, and design preferences to generate a seeded first page scaffold.

Core Features & Use Cases

  • Guided setup: asks one design decision at a time to configure tokens, typography, and layout.
  • Token-driven styling: updates color and typography tokens across light/dark themes.
  • First-page scaffold: generates an initial page shell based on the selected app type and branding.

Quick Start

Provide the project name, app type, and brand colors to generate the initial UI seed.

Frequently Asked Questions about ui-setup

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

FAQPage Schema
How do I automate UI project setup to generate a first page scaffold?▼

Automating UI project setup involves collecting branding and app type decisions to configure design tokens and generate an initial page shell. This Skill guides you through one design decision at a time to seed the first screen.

How does token-driven styling work for light and dark themes?▼

Token-driven styling updates color and typography tokens across light and dark themes. The setup process asks incremental branding decisions, applying these configurations directly to the generated design system tokens.

What is the best way to seed brand colors and typography for a new design system?▼

Seeding brand colors and typography requires a guided setup that configures design tokens based on your preferences. By providing project name, app type, and brand colors, you generate an initial UI seed with proper token-driven styling.

Do I need an existing design system to start the UI setup process?▼

You do not need an existing design system to start. The UI setup process is built for new projects using the StyleSeed Toss seed, guiding you through incremental branding decisions to configure tokens from scratch.

Can I configure layout and typography tokens one decision at a time?▼

You can configure layout and typography tokens through interactive, one-question-at-a-time prompting. This guided setup approach ensures you make individual design decisions to progressively build your token-driven configurations.

What limitations exist when generating a page scaffold for different app types?▼

Generating a page scaffold applies to new projects using the StyleSeed Toss seed. The setup focuses on seeding the initial page shell and first screen, meaning it is designed for starting projects rather than modifying existing complex layouts.

Related Skills

Explore More Design & Creative Skills→
anonymouswhite07anonymouswhite07

ui-setup

Guide the UI Setup wizard to collect app context, brand tokens, and typography.

Community
Intermediate
kmshihab7878kmshihab7878
6

shihab-task-mgmt

Define token-based design guidelines for Shihab Task Management UI components.

Community
Advanced
Signet-AISignet-AI
237

signet-design

Standardize Signet UI visuals with design tokens, typography, and icons.

Official
Intermediate
CYBERSTALKER07CYBERSTALKER07

design-system

Define and apply centralized design tokens, typography, spacing, and components for Leviathan Retailer Desktop.

Community
Advanced