Design & Frontend exporeact-nativeapple-higsemantic-colorssf-symbolsresponsive-layout

Expo Native UI Guide

Helps Expo developers build responsive screens with Apple-informed styling and a native-feeling experience.

FollowSkills review · FSRS-2.0
Not recommended
51/ 100 5-point scale 2.6 / 5
Trust17 / 25 · 3.4/5

The files show no malware, credential theft, covert exfiltration, destructive defaults, or disproportionate permissions. Camera, microphone, and media-library permissions are partly disclosed, and the README says telemetry is off by default. Points are deducted because confirmation, data-flow boundaries, rollback, failure recovery, and dependency-security guidance are incomplete; media examples also use remote resources.

Reliability5 / 20 · 1.3/5

The coverage is broad and most examples are readable, but there are material contradictions: the main document forbids Picker and expo-symbols while controls.md demonstrates Picker and icons.md imports expo-symbols. Expo Go, SDK, and New Architecture compatibility is also incomplete. Static review provides no key-path tests or abnormal-input feedback, so the score remains below the 10-point static ceiling.

Adaptability10 / 15 · 3.3/5

The audience and main scenarios are clear, and routing is explicitly delegated to expo-router. References are organized by animation, controls, media, storage, and related topics. Points are deducted for missing explicit inputs, outputs, non-fit boundaries, and trigger conditions; platform and SDK constraints are scattered, with no Chinese-language support or mainland-China reachability guidance.

Convention9 / 15 · 3.0/5

The skill has front matter, a version, MIT licensing, topic-based reference files, and many examples. Points are deducted for the absence of a changelog, explicit maintenance owner, or update path; installation notes, troubleshooting, known limitations, and compatibility matrices are thin, and internal naming and policy conflicts remain.

Effectiveness6 / 15 · 2.0/5

The material supplies directly adaptable snippets for native-feeling Expo colors, controls, animation, media, storage, and visual effects, so the core use case has clear value. Points are deducted because some recommendations or examples may be outdated, contradictory, or SDK/platform-specific, and there is no static evidence of representative output validation; users still need substantial manual checking.

Verifiability4 / 10 · 2.0/5

Evidence consists mainly of revisioned skill files, references, README, license, and limited CI checks; the README identifies Expo documentation, CLI, and EAS CLI as the source of truth. Points are deducted because CI checks description/version limits rather than the skill’s technical guidance, and there is no committed test suite, third-party corroboration, or independently reproducible key-path evidence, keeping the score at or below the static 5-point ceiling.

Evidence confidence:Low Reviewed Jul 20, 2026 Reviewed revision 8bd359f8a44d
Before you use it
  • Resolve the conflicts among the Picker, expo-symbols, expo-image, and expo-router guidance, and label Expo SDK/platform compatibility.
  • Add permission confirmation, data-flow, error-handling, and recovery guidance for camera, microphone, media-library, remote-media, and sensitive-storage use cases.
  • Add dependency installation, troubleshooting, known limitations, maintenance ownership, update path, and Chinese/mainland-China environment guidance.
See the full review method →

What does this skill do, and when should you use it?

Expo Native UI is an open-source Agent Skill that guides an AI agent in building native-feeling Expo screens. It covers Apple HIG styling, semantic colors, native controls, SF Symbols, media, animations, visual effects, gradients, storage, and responsive layout. Routing and navigation are explicitly delegated to the separate expo-router skill. It also directs developers to try Expo Go first and create custom builds only when native code or configuration requires them.

Instructs the agent to consult references for animations, controls, gradients, icons, media, storage, visual effects, and WebGPU/Three.js; write Expo and React Native UI code; start the app with npx expo start and test it first in Expo Go; and use npx expo run:ios, npx expo run:android, or eas build when local Expo modules, Apple targets, unsupported third-party native modules, or native configuration beyond app.json are required.

  1. An Expo developer building a mobile screen that should feel closer to a native iOS interface.
  2. A React Native team needing semantic colors, dark-mode behavior, native controls, or SF Symbols.
  3. An Expo project adding animations, gestures, media, blur, or liquid-glass effects.
  4. A developer who wants to validate UI quickly in Expo Go before creating a custom build.

What are this skill's strengths and limitations?

Pros
  • Covers common Expo UI work across styling, colors, controls, icons, animations, media, storage, and visual effects.
  • Provides a clear Expo Go-first workflow that can avoid unnecessary custom builds.
  • Gives concrete library preferences and guidance for avoiding removed or legacy modules.
  • MIT-licensed and included in a skill collection maintained by the official Expo team.
Limitations
  • Its scope is limited to expo-native-ui; routing and navigation belong to another skill.
  • The SKILL.md provides no test suite, automated validation workflow, or platform compatibility matrix.
  • Some capabilities depend on specific SDK or native conditions; for example, CSS gradients require the New Architecture.
  • The README's installation and update instructions target the full 23-skill collection, not this skill alone.

How do you install this skill?

The README documents installation for the entire expo/skills collection. With Skills CLI, run: npx skills@latest add expo/skills --skill '*'. In Codex, install the collection plugin with: codex plugin add expo@openai-curated. The README does not document a dedicated single-skill installation command for expo-native-ui.

How do you use this skill?

After installing the skill for your agent, give it a concrete Expo UI task, such as: "Build a native-feeling Expo screen with semantic colors, native controls, SF Symbols, and responsive layout." For routes, links, stacks, tabs, modals, sheets, or headers, use the expo-router skill as well.

How does this skill compare with similar options?

Its boundary with the expo-router skill is explicit: expo-native-ui covers styling and native UI capabilities, while expo-router covers routing and navigation. Compared with immediately running custom iOS or Android builds, it recommends trying Expo Go first and building only when native code or configuration is required.

FAQ

Does this skill include routing and navigation?
No. Use the expo-router skill for routes, links, stacks, tabs, modals, sheets, and headers.
Do I always need a custom development build?
No. The skill says to run npx expo start and test in Expo Go first. Custom builds are needed for local Expo modules, Apple targets, unsupported third-party native modules, or native configuration that app.json cannot express.
Does the skill require paid EAS services?
The UI guidance does not state that paid services are mandatory. When a custom build is required, the SKILL.md lists eas build as an option.
Who should adopt it?
It fits Expo and React Native projects building mobile interfaces, especially teams prioritizing native-feeling visuals, responsive layouts, and Apple HIG guidance.

More skills from this repository

All from expo/skills

Dev & Engineering

Expo Native UI Builder

Build native-feeling, cross-platform interfaces with @expo/ui.

Dev & Engineering

Expo Brownfield Integrator

Guides teams in incrementally embedding Expo and React Native into existing native iOS or Android applications.

Dev & Engineering

Expo App Structure Guide

A clear, scalable starting layout for a brand-new Expo Router app.

Automation & Ops

EAS Observe Performance Guide

Helps Expo teams instrument, query, and interpret production startup, navigation, and custom-event performance metrics.

Dev & Engineering

Expo Data Fetching

Practical networking guidance for Expo apps, covering API calls, caching, offline behavior, and authentication.

Dev & Engineering

Expo Skill Feedback

Collects feedback about Expo skills or Expo itself and manages anonymous usage telemetry.

Dev & Engineering

Expo Web-to-Native Migration

Turn an existing React website into a shippable Expo app, screen by screen.

Dev & Engineering

Expo Integration Examples

Adapt Expo’s official patterns for third-party integrations.

Dev & Engineering

Expo SDK Upgrade Assistant

Guides Expo SDK upgrades, dependency fixes, and compatibility cleanup.

Dev & Engineering

Expo DOM Components

Reuse web code and browser-only libraries inside Expo native apps with incremental migration support.

Dev & Engineering

Expo Skill Eval

End-to-end testing for Expo skill triggering, code quality, and runtime rendering.

Dev & Engineering

Expo Tailwind Styling Setup

Configure Tailwind CSS v4, NativeWind v5, and cross-platform styling for Expo apps.

Dev & Engineering

Expo Native Module Migration Assistant

Move an existing Expo Swift module from the 1.0 DSL to the 2.0 macro API without changing its JavaScript contract.

Dev & Engineering

EAS Cloud Simulator

Run, control, and capture Expo apps remotely when a local iOS simulator or Android emulator is unavailable.

Automation & Ops

EAS Update Health Insights

Use the CLI to measure EAS Update health, adoption, crashes, and rollout readiness.

Dev & Engineering

Expo App Clip Builder

Configure an iOS App Clip for an Expo app and launch it from web URLs.

Dev & Engineering

Expo Development Client Builder

Build and distribute Expo development clients for native-code testing.

Dev & Engineering

Expo App Store Release Assistant

Build and ship Expo apps to the App Store, Google Play, and TestFlight with EAS.

Automation & Ops

Expo EAS Workflow Assistant

Write and validate EAS CI/CD workflows for Expo projects.

Dev & Engineering

Expo EAS Hosting Deployments

Deploy Expo websites and API routes while configuring secrets, domains, and the edge runtime.

Related skills