Is it optimized for both iOS and Android?

Yes, it includes platform considerations such as Apple's Human Interface Guidelines for touch targets, safe area management, and haptic feedback integration.

Does it support dark mode?

Yes, it includes specific patterns for 'dark mode with personality,' focusing on elevation and surface colors rather than simple black-and-white inversion.

What is the React Native Mobile Design skill?

It is a specialized Claude Code capability that provides guidance and code implementation patterns for creating high-end, custom mobile interfaces using React Native.

Which tech stack does this skill recommend?

The skill focuses on modern tools like NativeWind (Tailwind for React Native), Reanimated for motion, Gesture Handler for interactions, and Expo for optimized images and fonts.

How does it help with mobile aesthetics?

It provides strategies to avoid 'generic' looks by using custom color palettes, unique typography, and depth-based component design instead of standard system defaults.

React Native Mobile Design

Name: React Native Mobile Design
Author: allen-hsu

byallen-hsu

Mobile Development

Creates distinctive, production-grade mobile interfaces for React Native that prioritize high-end design quality and custom aesthetics.

About

This skill empowers developers to build visually striking and professional mobile applications by moving beyond generic AI-generated layouts. It provides domain-specific patterns for React Native using a modern tech stack including NativeWind, Reanimated, and Gesture Handler. By focusing on bespoke color systems, advanced typography, and meaningful motion, it helps you implement high-fidelity UI components, expressive animations, and platform-specific optimizations like haptic feedback and safe area management that feel native and refined.

Key Features

Sophisticated color systems with semantic and branded palettes
Advanced typography integration for custom font scales
Platform-specific polish for touch targets, safe areas, and haptics
0 GitHub stars
High-performance animations and micro-interactions using Reanimated
Modern layout patterns including depth-focused cards and asymmetric grids

Use Cases

Enhancing existing React Native apps with custom animations and transitions
Building premium, brand-focused mobile applications from scratch
Refining generic UI components into production-grade, polished interfaces

About

Key Features

Sophisticated color systems with semantic and branded palettes
Advanced typography integration for custom font scales
Platform-specific polish for touch targets, safe areas, and haptics
0 GitHub stars
High-performance animations and micro-interactions using Reanimated
Modern layout patterns including depth-focused cards and asymmetric grids

Use Cases

Enhancing existing React Native apps with custom animations and transitions
Building premium, brand-focused mobile applications from scratch
Refining generic UI components into production-grade, polished interfaces