cpn-basic-box
OfficialGuide AI to correctly use UDesign Box for layouts.
AuthorUCloud-FE
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill helps AI correctly use the UDesign Box component to address frontend layout and styling challenges by providing a concise set of patterns and rules that align with the design system.
Core Features & Use Cases
- Container-based layout: supports common Box props like direction, spacing, wrap, alignItems, justifyContent for building responsive layouts.
- Practical patterns: demonstrates grid-like spans, card layouts, and flex arrangements using Box components.
- Best practices: enforces design-system-compliant usage and prevents leakage of raw HTML styles by preferring UDesign primitives.
Quick Start
Provide a simple Box-based layout example that shows a container with spacing and wrap to form a responsive grid.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: cpn-basic-box Download link: https://github.com/UCloud-FE/udesign-cli/archive/main.zip#cpn-basic-box Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.