Shared Package Exports

.claude/rules/design-tokens.md

← Zurück zu Knowledge

Shared Package Exports

.claude/rules/design-tokens.md · 1.1K

---
paths:
  - "apps/mobile/**/*.ts"
  - "apps/mobile/**/*.tsx"
  - "packages/shared/**"
---

# Shared Package Exports

The `@carrot/shared` package provides these imports:

```ts
import { colors, spacing, fontSize, fontFamily, radii, shadows, springs, durations } from '@carrot/shared/constants';
import type { Database } from '@carrot/shared/database.types';
```

| Module | Contents |
|--------|----------|
| `colors` | Brand orange (#FA7000), white, gray scale (50-900), semantic (success/warning/error/info), text colors, backgrounds |
| `spacing` | xs(4) sm(8) md(12) lg(16) xl(24) 2xl(32) 3xl(48) 4xl(64) |
| `fontSize` | xs(12) sm(14) md(16) lg(18) xl(20) 2xl(24) 3xl(30) 4xl(36) |
| `fontFamily` | regular, medium, bold (System default, customizable later) |
| `radii` | none(0) sm(4) md(8) lg(12) xl(16) 2xl(24) full(9999) |
| `shadows` | sm, md, lg (React Native shadow objects with elevation) |
| `springs` | gentle, bouncy, snappy (Reanimated spring configs) |
| `durations` | fast(150) normal(250) slow(400) |

**Never hardcode colors/spacing/font sizes** — always use `@carrot/shared/constants`.