react-native-design
Installation
Summary
Cross-platform mobile apps with React Native styling, navigation, and performant Reanimated animations.
- Covers StyleSheet patterns, dynamic styling, Flexbox layouts, and platform-specific designs for iOS and Android
- Includes React Navigation 6+ setup for stack and tab navigators with type-safe route definitions
- Provides Reanimated 3 fundamentals including shared values, animated styles, and Gesture Handler integration for drag interactions
- Features best practices for performance (memoization, UI thread animations, FlatList usage) and common troubleshooting patterns
SKILL.md
React Native Design
Master React Native styling patterns, React Navigation, and Reanimated 3 to build performant, cross-platform mobile applications with native-quality user experiences.
When to Use This Skill
- Building cross-platform mobile apps with React Native
- Implementing navigation with React Navigation 6+
- Creating performant animations with Reanimated 3
- Styling components with StyleSheet and styled-components
- Building responsive layouts for different screen sizes
- Implementing platform-specific designs (iOS/Android)
- Creating gesture-driven interactions with Gesture Handler
- Optimizing React Native performance
Detailed section: Core Concepts
Originally a 6471-byte section in this SKILL.md. Moved to references/details.md to fit Codex's 8 KB skill body cap.