react-native-design

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

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.