Core Components

---
version: 4.1.0-fractal
name: core-components
description: Core component library and design system patterns. Use when building UI, using design tokens, or working with the component library.
---

# Core Components

## Design System Overview

Use components from your core library instead of raw platform components. This ensures consistent styling and behavior.

## Design Tokens

**NEVER hard-code values. Always use design tokens.**

## 🧠 Knowledge Modules (Fractal Skills)

### 1. [Spacing Tokens](./sub-skills/spacing-tokens.md)
### 2. [Color Tokens](./sub-skills/color-tokens.md)
### 3. [Typography Tokens](./sub-skills/typography-tokens.md)
### 4. [Box](./sub-skills/box.md)
### 5. [HStack / VStack](./sub-skills/hstack-vstack.md)
### 6. [Text](./sub-skills/text.md)
### 7. [Button](./sub-skills/button.md)
### 8. [Input](./sub-skills/input.md)
### 9. [Card](./sub-skills/card.md)
### 10. [Screen Layout](./sub-skills/screen-layout.md)
### 11. [Form Layout](./sub-skills/form-layout.md)
### 12. [List Item Layout](./sub-skills/list-item-layout.md)