core-components

What problem does it solve?

This Skill provides a standardized library of UI components and design tokens to ensure visual consistency and efficient development across the application. It prevents hard-coded values and promotes the use of reusable elements.

Core Features & Use Cases

• Reusable UI Components: Utilizes pre-built components like Box, Text, Button, Input, and Card for rapid UI development.
• Design Token System: Enforces the use of design tokens for spacing, colors, and typography, ensuring brand consistency and maintainability.
• Layout Patterns: Offers predefined patterns for common screen structures like Screen Layout, Form Layout, and List Item Layout.
• Use Case: When developing a new feature, use the Button component with appropriate variants and token-based padding instead of creating custom button styles from scratch.

Quick Start

Use the core-components skill to render a Card with a title and body content.