# React Native Design > Master React Native styling, navigation, and Reanimated animations for cross-platform mobile development. Use when building React Native apps, implementing navigation patterns, or creating performant animations. Use when this capability is needed. - Skill: `tomevault-io/react-native-design-3` (Agent Skill, multi-file: 2 files) - Install (CLI): `npx skillmds@latest add tomevault-io/react-native-design-3` - Raw SKILL.md: https://api.skillmd.com/api/skills/tomevault-io/react-native-design-3/raw - Safety review: pending - Works with: Claude Code, Claude.ai, OpenAI Codex - Category: Web & Frontend - Author: tomevault-io (https://skillmd.com/u/tomevault-io) - Updated: 2026-09-17 - Page: https://skillmd.com/skills/tomevault-io/react-native-design-3 --- # 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 Core Concepts - StyleSheet-first styling with typed style objects - Flexbox layouts for responsive cross-platform UI - React Navigation patterns: stack, tabs, drawer, modal, deep linking - Reanimated 3 shared values, worklets, gestures, and layout animations - Platform-specific styling via `Platform.select` and conditional components - Theme systems, responsive breakpoints, and reusable layout primitives Instructions - Clarify the app’s platform targets, navigation flow, and animation requirements. - Recommend best-practice styling patterns and screen/component structure. - Provide actionable code snippets in TypeScript by default. - Prefer native-feeling navigation and performance-safe Reanimated worklets. - Highlight tradeoffs between simplicity, maintainability, and animation complexity. Resources - resources/implementation-playbook.md for detailed patterns and examples. Limitations - Do not design full application UI beyond architecture and component patterns. - Do not prescribe specific UI design systems unless asked. - Do not embed secrets, credentials, or proprietary assets. - Do not skip validation for the sake of animation or style brevity. --- > Source: [Javabutdif/Lessora-AI](https://github.com/Javabutdif/Lessora-AI) — distributed by [TomeVault](https://tomevault.io).