Theming
Customize components and templates with a centralized, accessible theming system that supports light/dark modes and follows WCAG guidelines.
The theming system provides a comprehensive, centralized approach to styling your React Native app. The theme configuration is pre-defined in the craftrn-ui/themes folder, containing colors, spacing, and typography definitions that are integrated with Unistyles for seamless access across your entire application.
All components and templates are built on this unified theme configuration, ensuring consistency while simplifying maintenance. The system supports dynamic theme switching (such as light/dark mode) and is designed with accessibility in mind. Color contrasts meet WCAG guidelines, and all visual elements remain usable across different themes and user preferences, making your app accessible to everyone regardless of their visual abilities or device settings.
Color Palette
Neutral
Brand
Semantic
Non-semantic
Light and dark themes
Background
Accent
Content
Border & Shadow
Semantic
Non-semantic
Border radius
Spacings
Text variants
Introduction
Ever felt trapped by rigid component libraries that limit your creativity? CraftReactNative breaks free from that constraint. This isn't a component library you install. It's a curated collection of components and templates designed to give you full creative control and build your mobile apps.
Quick start
Running the demo app locally will allow you to browse through the components and interact with them.