The Art of
Visuals.
Uilora components are designed to be beautiful out of the box, but we give you complete control over how they look and feel in your app.
Native Style Sheets
Full support for standard React Native Styling. No custom engines to learn.
Reanimated Power
Built with high-fidelity performance. Dynamic styles run directly on the UI thread.
Custom Themes
Easily override colors, margins, and typography through our theme objects.
Native
Style Sheets.
Most Uilora components expose a `style` or `containerStyle` prop that allows you to apply layouts and visual properties using the standard React Native API.
// Standard usage
<HeroButton
containerStyle={styles.btn}
textStyle={{ color: 'gold' }}
/>
//
const styles = StyleSheet.create({
btn: {
marginTop: 20,
borderRadius: 32,
}
});
const animatedStyle = useAnimatedStyle(() => ({
transform: [{ scale: withSpring(active.value) }],
opacity: withTiming(active.value),
}));
//
<AnimatedCard style={animatedStyle} />
Dynamic
Interaction.
Motion is at the core of Uilora. Our components are built using React Native Reanimated, allowing you to pass worklet-based styles for butter-smooth interactions.
60FPS Performance
Styles run on the UI thread.
Physics Based
Natural spring interactions.
Ready to see
The Power of Choice?
Now that you know how to style components, let's explore some platform-specific notes for iOS and Android.