Components
TabBarIcon
A fixed-size (28px) FontAwesome glyph for a bottom tab bar.
color is required — the tab navigator passes the active/inactive tint.
This example is composed with Storybook args. Open the interactive workbench to change its props and inspect the generated API controls.
Import
import { TabBarIcon } from '@simal/ui/nativewindui';Props
| Prop | Values | Default | Description |
|---|---|---|---|
name | — | "home" | Glyph name for the tab. Fixed-size — the tab bar controls the dimensions. |
color | — | "#0A0A0A" | Passed down by the navigator, which flips it between the active and inactive tint. Set it manually only outside a tab bar. |
Examples
Active And Inactive
Active vs inactive is expressed purely through color.
<View className="flex-row items-center gap-8">
<TabBarIcon name="home" color="#0A0A0A" />
<TabBarIcon name="calendar" color="#9A9A9A" />
<TabBarIcon name="user" color="#9A9A9A" />
</View>