ui-page

Scaffold mobile-first pages using Toss seed layout patterns and shell components.

25|6|Updated Apr 20, 2026
One-click install
npx skills add https://github.com/KRISHNA0R/PORTFOLIOv2 --skill ui-page-krishna0r
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-page
Source: https://github.com/KRISHNA0R/PORTFOLIOv2/tree/main/.agents/skills/ui-page
Command: npx skills add https://github.com/KRISHNA0R/PORTFOLIOv2 --skill ui-page-krishna0r

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill scaffolds a complete mobile-first page using the Toss seed's layout patterns, ensuring consistency with the existing shell, top bar, bottom navigation, and card rhythm across screens.

Core Features & Use Cases

  • Scaffolds a complete page or screen on a Toss-seed app built on StyleSeed patterns.
  • Enforces shell consistency by reusing the page shell, top bar, bottom navigation, and rhythm guidance.
  • Helps teams rapidly spin up new product flows while preserving layout and navigation standards.

Quick Start

Use the ui-page skill to scaffold a new Toss-seed page using the existing shell and layout rules.

Frequently Asked Questions about ui-page

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

FAQPage Schema
How do I scaffold a mobile-first page with consistent layout and navigation?

To scaffold a mobile-first page with consistent layout and navigation, generate a ready-to-integrate page scaffold using Toss seed layout patterns, enforcing shell consistency, top bar, and bottom navigation across screens.

What is the best way to maintain card rhythm across new screens in a Toss-seed app?

The best way to maintain card rhythm across new screens in a Toss-seed app is to apply StyleSeed Toss principles during page scaffolding, which automatically enforces consistent card rhythm and layout standards.

Does this page scaffolding approach require existing shell components to work?

Yes, this page scaffolding approach requires existing shell components to work, as it reuses the established page shell, top bar, and bottom navigation to preserve layout consistency within the Toss-seed app.

How to rapidly spin up new product flows while preserving layout standards?

To rapidly spin up new product flows while preserving layout standards, scaffold complete pages using Toss seed layout patterns that automatically enforce shell consistency and navigation rules.

Can I use this scaffolding method for apps not built on StyleSeed patterns?

No, you cannot use this scaffolding method for apps not built on StyleSeed patterns, because it specifically requires alignment with StyleSeed Toss principles to output a properly integrated page scaffold.

Why does my new Toss page layout break the existing navigation rhythm?

Your new Toss page layout breaks the existing navigation rhythm when the page scaffold lacks alignment with StyleSeed Toss principles, which enforce shell consistency, top bar integration, and bottom navigation standards.