Framework-agnostic, production-ready, with smooth animations and zero navigation dependencies.
Smooth animations and beautiful design that feels native
Experience fluid transitions and smooth interactions designed for real-world applications.
Icons animate with perfect timing and easing
Beautiful search integration with natural animations
Optional blur effects with Haze integration
Show counts or indicators on navigation items
Light Theme
Smooth & MinimalDark Theme
Bold & VibrantEverything you need for production-grade navigation
Works with Navigation3, Decompose, Voyager, or plain state—you control the logic.
Smooth 60fps transitions and scale effects that feel native on all devices.
Built-in expandable search with customizable callbacks.
Optional blur effects with Haze integration for stunning visuals.
Show notification counts or dots without extra UI elements.
Zero navigation dependencies, minimal overhead, tiny footprint.
Extensive styling options with sensible defaults.
Android, iOS, and more. Share code across platforms.
Add FlowTab to your project in minutes
# In your libs.versions.toml (Recommended)
[versions]
flowtab-cmp = "0.5.1-beta"
[libraries]
flowtab-cmp = { module = "io.github.alims-repo:flowtab-cmp", version.ref = "flowtab-cmp" }
// In your module's build.gradle.kts
dependencies {
implementation(libs.flowtab.cmp)
}
// build.gradle (Groovy DSL)
dependencies {
implementation 'io.github.alims-repo:flowtab-cmp:0.5.1-beta'
}
Create a list of NavItem with labels and icons
Place BottomNavigation in your Scaffold
Update state on item selection and navigate
Choose the style that matches your design
Full-width background highlight. Perfect for bold designs and high contrast.
Small circular indicator below items. Modern and minimal aesthetic.
Horizontal line below selected item. Material Design 3 style.
Works with any navigation solution
Navigation Compose
Decompose
Voyager
PreCompose
Appyx
Plain State
Customize every aspect of your navigation
| Parameter | Type | Default | Description |
|---|---|---|---|
height |
Dp | 60.dp | Height of the navigation bar |
cornerRadius |
Dp | 60.dp | Border radius for rounded corners |
maxWidth |
Dp | 460.dp | Maximum width (for tablets) |
animationDuration |
Int | 250 | Duration in milliseconds |
enableBlur |
Boolean | true | Enable blur effects |
showLabels |
Boolean | true | Show text labels |
Follow these patterns for optimal implementation
rememberStart using FlowTab today and deliver beautiful navigation to your users.