new-page - Create New Pages with Design System Compliance
Build new project pages that adhere to design rules and include required layout sections
Tags
Updated: 2026-02-17Capabilities
Typical Inputs
Typical Outputs
What this skill does
- read design rules
- read design tokens
- review section patterns
- draft page outline
- implement page sections
- update routing
- run ESLint
- run build command
Inputs
- design_rules.md
- client/src/design-tokens.ts
- component patterns
- placeholder images
- ESLint config
- npm build script
Outputs
- new page files
- updated routing
- linting results
- build output
Requirements
- Home Kitchen Systems hero pattern
- full-blue trust-gradient section
- Buy Now Pay Later style section
- placeholder image sections
- design token usage
- alternating background rhythm
- inverse badge styling for blue sections