building-native-ui

Installation
Summary

Complete guide for building native Expo apps with routing, styling, components, and platform conventions.

  • Covers Expo Router fundamentals, native tabs, stack navigation, modals, and form sheets with detailed route structure conventions
  • Includes styling rules aligned with Apple Human Interface Guidelines: flexbox layouts, safe area handling, animations, shadows via CSS boxShadow, and responsive design patterns
  • Documents library preferences (expo-image for SF Symbols, expo-audio, expo-video, expo-glass-effect) and anti-patterns to avoid (legacy modules, intrinsic HTML elements, StyleSheet over inline styles)
  • Provides reference guides for animations, controls, search, storage, visual effects, WebGPU/3D graphics, and zoom transitions
  • Emphasizes testing in Expo Go first before creating custom builds, with clear guidance on when native code is actually required
SKILL.md

Expo UI Guidelines

For routes, links, stacks, tabs, modals, sheets, and headers, use the expo-router skill.

References

Consult these resources as needed:

references/
  animations.md          Reanimated: entering, exiting, layout, scroll-driven, gestures
  controls.md            Native iOS: Switch, Slider, SegmentedControl, DateTimePicker, Picker
  gradients.md           CSS gradients via experimental_backgroundImage (New Arch only)
  icons.md               SF Symbols via expo-image (sf: source), names, animations, weights
  media.md               Camera, audio, video, and file saving
  storage.md             SQLite, AsyncStorage, SecureStore
  visual-effects.md      Blur (expo-blur) and liquid glass (expo-glass-effect)
  webgpu-three.md        3D graphics, games, GPU visualizations with WebGPU and Three.js
Related skills
Installs
58.7K
Repository
expo/skills
GitHub Stars
2.3K
First Seen
Jan 19, 2026
building-native-ui — expo/skills