Creating Zest Components for React Native

Guide for creating new components in the Zest design system for React Native applications (zest-react-native repository).

When to Use This Skill

Use this skill when:

• Creating a new Zest component from Figma designs for mobile
• Adding a new variant to an existing Zest React Native component
• Building reusable UI components for the React Native design system
• Implementing components that will be used across multiple features/brands on mobile

Core Principles

Components live in zest-react-native repository: All Zest components for React Native are in the standalone zest-react-native repository. This is the single source of truth for the Zest design system on mobile.

Use Zest primitives (Button, Text, Icon, Card): Build new components using existing Zest primitives. These provide theme integration and design tokens.

TypeScript is required: All components must be written in TypeScript with proper type definitions, interfaces, and exports.