ReddRadar
Agent skill
tamagui
Universal React + React Native UI library with optimizing compiler. Use when building cross-platform apps with shared styling, design tokens, themes, and accessible components.
Install this agent skill to your Project
npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/data/tamagui
Metadata
Additional technical details for this skill
- author
- ai-standards
- version
- 1.0
- language
- typescript
- frameworks
- react, react-native, next, expo, vite
SKILL.md
Tamagui Skill
Style React fast with 100% parity on React Native, an optional UI kit, and optimizing compiler.
Documentation
Core concepts for understanding and using Tamagui's styling system.
| Topic | Description | URL |
|---|---|---|
| Introduction | Overview and key concepts | docs |
| Installation | Getting started and setup | docs |
| Configuration | createTamagui and config options | docs |
| Themes | Dark/light modes and custom themes | docs |
| Tokens | Design tokens for spacing, colors, fonts | docs |
| styled() | Create styled components with variants | docs |
| Animations | Animation drivers and configuration | docs |
| Compiler | Optimizing compiler setup | docs |
| UI Components | Pre-built component library overview | docs |
Source Code
Direct links to implementation code in the monorepo.
| Area | Description | URL |
|---|---|---|
| Repository | Main monorepo with all packages | https://github.com/tamagui/tamagui |
| UI Components | 50+ themed, accessible components | https://github.com/tamagui/tamagui/tree/main/code/ui |
| Core Packages | Styling engine, themes, hooks, fonts | https://github.com/tamagui/tamagui/tree/main/code/core |
| Compiler Plugins | Bundler plugins for style extraction | https://github.com/tamagui/tamagui/tree/main/code/compiler |
Framework Guides
Setup instructions for integrating Tamagui with specific frameworks and bundlers.
| Framework | Description | Docs |
|---|---|---|
| Expo | React Native with Expo managed workflow | docs |
| Next.js | Server-side rendering and App Router | docs |
| Vite | Fast web development with HMR | docs |
| Metro | React Native bundler configuration | docs |
Local References
Detailed reference files with component and API documentation.
references/components.md- UI component library with docs and source linksreferences/core.md- Core packages, configuration APIs, and hooksreferences/compiler.md- Bundler plugins and optimization setup
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
majiayu000/claude-skill-registry
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
majiayu000/claude-skill-registry
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
majiayu000/claude-skill-registry
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
majiayu000/claude-skill-registry
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
majiayu000/claude-skill-registry
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
majiayu000/claude-skill-registry
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
Didn't find tool you were looking for?