Implement navigation in Jetpack Compose using Navigation 3. An agent skill from new-silvermoon/awesome-android-agent-skills.

Apache-2.0Auto-check passedMobile

Install Navigation3

skills CLI
$ npx skills add new-silvermoon/awesome-android-agent-skills --skill navigation3 -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install new-silvermoon/awesome-android-agent-skills navigation3 --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/new-silvermoon/awesome-android-agent-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.github/skills/ui/compose-navigation .claude/skills/navigation3 && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
navigation3
GitHub stars
972
Token cost
~1.9k tokens
SKILL.md length
377 words
Files
1
Skills in repo
2
Repo updated
First seen
Licence
Apache-2.0

At a glance

Implement navigation in Jetpack Compose using Navigation 3. An agent skill from new-silvermoon/awesome-android-agent-skills.

  • Works in 3 steps: Define Navigation Keys → Create the Back Stack → Create NavDisplay
  • Asked to build state-driven navigation
  • SKILL.md covers Overview, Setup, Core Concepts and Navigation Patterns, plus 10 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Navigation3 is an agent skill from new-silvermoon/awesome-android-agent-skills. Implement navigation in Jetpack Compose using Navigation 3. Use when asked to build state-driven navigation, manage back stacks, scope ViewModels, implement adaptive layouts, or migrate from Navigation Compose.

Its SKILL.md is about 1.9k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Mobile, covering Android development and Responsive design. It works with Jetpack Compose. The repository describes itself as: A collection of standardized Agent Skills to teach GitHub Copilot, Claude, Gemini and Cursor about modern Android development (Kotlin, Jetpack Compose, etc.). The licence is Apache-2.0.

When your agent uses it

  • Asked to build state-driven navigation
  • Manage back stacks
  • Scope ViewModels
  • Implement adaptive layouts

Example prompts

  • “/navigation3”

Workflow steps

3 steps, taken from the step headings in SKILL.md.

  1. Define Navigation Keys
  2. Create the Back Stack
  3. Create NavDisplay

What it can do on your machine

Read from SKILL.md and the folder at commit 82900ea. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are kotlin).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Navigation3 loads about 1.9k tokens when it runs. Until then it costs about 56 tokens; SKILL.md has 377 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~56
When it runs · the whole SKILL.md, loaded when a task matches
~1.9k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from new-silvermoon/awesome-android-agent-skills at commit 82900ea, republished under its Apache-2.0 licence (© new-silvermoon). 377 words, ~1,932 tokens.

Download SKILL.mdSave it as .claude/skills/navigation3/SKILL.md (or your agent's skills folder).
name
navigation3
description
Implement navigation in Jetpack Compose using Navigation 3. Use when asked to build state-driven navigation, manage back stacks, scope ViewModels, implement adaptive layouts, or migrate from Navigation Compose.

Navigation 3

Overview

Implement state-driven navigation in Jetpack Compose using Navigation 3. Unlike Navigation Compose, Navigation 3 models navigation as application state rather than through a NavController. This skill covers navigation keys, back stack management, ViewModel scoping, entry decorators, adaptive layouts, deep links, animations, state restoration, and testing.

Setup

Add the Navigation 3 dependencies:

kotlin
// build.gradle.kts
dependencies {

    implementation("androidx.navigation3:navigation3-runtime:1.0.0-alpha08")
    implementation("androidx.navigation3:navigation3-ui:1.0.0-alpha08")

    // Lifecycle integration
    implementation("androidx.lifecycle:lifecycle-viewmodel-navigation3:2.9.2")

    // Serialization
    implementation("org.jetbrains.kotlinx:kotlinx-serialization-json:1.8.1")
}

// Enable serialization plugin
plugins {
    kotlin("plugin.serialization") version "2.2.0"
}

Core Concepts

1. Define Navigation Keys

Navigation destinations are represented by immutable serializable objects.

kotlin
import kotlinx.serialization.Serializable

@Serializable
data object Home

@Serializable
data class Profile(
    val userId: String
)

@Serializable
data class Product(
    val productId: String,
    val showReviews: Boolean = false
)

@Serializable
data object Settings

Keys become your navigation state.


2. Create the Back Stack

Navigation 3 replaces NavController with a mutable state back stack.

kotlin
@Composable
fun MyApp() {

    val backStack = remember {
        mutableStateListOf<Any>(Home)
    }

    AppNavDisplay(backStack)
}

3. Create NavDisplay
kotlin
@Composable
fun AppNavDisplay(
    backStack: SnapshotStateList<Any>
) {

    NavDisplay(
        backStack = backStack,
        onBack = {
            if (backStack.size > 1) {
                backStack.removeLast()
            }
        }
    ) { key ->

        when (key) {

            Home ->
                HomeScreen(
                    onProfileClick = {
                        backStack += Profile(it)
                    }
                )

            is Profile ->
                ProfileScreen(
                    userId = key.userId
                )

            is Product ->
                ProductScreen(
                    productId = key.productId,
                    showReviews = key.showReviews
                )

            Settings ->
                SettingsScreen()
        }
    }
}

Navigation Patterns

Navigate Forward
kotlin
backStack += Profile("user123")
Navigate Back
kotlin
backStack.removeLast()
Replace Current Screen
kotlin
backStack[backStack.lastIndex] = Home
Clear Back Stack
kotlin
backStack.clear()
backStack += Home
Pop To Root
kotlin
while (backStack.size > 1) {
    backStack.removeLast()
}

Argument Handling

Retrieve Arguments

Arguments already exist inside the navigation key.

kotlin
when (val key = currentKey) {

    is Profile -> {
        ProfileScreen(
            userId = key.userId
        )
    }

    is Product -> {
        ProductScreen(
            productId = key.productId
        )
    }
}
Pass IDs, Not Objects
kotlin
// CORRECT
backStack += Profile(user.id)

// Fetch object inside ViewModel
class ProfileViewModel(
    savedStateHandle: SavedStateHandle,
    repository: UserRepository
) : ViewModel() {

    val profile = savedStateHandle.toRoute<Profile>()

    val user =
        repository.getUser(profile.userId)
}
kotlin
// INCORRECT

backStack += User(...)
backStack += ProductRepository(...)
backStack += ProductViewModel(...)

ViewModel Integration

Navigation 3 scopes ViewModels using entry decorators.

kotlin
NavDisplay(

    backStack = backStack,

    entryDecorators = listOf(

        rememberSceneSetupNavEntryDecorator(),

        rememberSavedStateNavEntryDecorator(),

        rememberViewModelStoreNavEntryDecorator()
    )

) { key ->

    // destinations
}
ViewModel Example
kotlin
class ProfileViewModel(
    savedStateHandle: SavedStateHandle
) : ViewModel() {

    val profile =
        savedStateHandle.toRoute<Profile>()
}

Entry Decorators

Navigation 3 uses decorators to attach lifecycle functionality.

Scene Setup
kotlin
rememberSceneSetupNavEntryDecorator()

Creates the navigation scene for each entry.

Saved State
kotlin
rememberSavedStateNavEntryDecorator()

Automatically restores destination state after process recreation.

ViewModel Store
kotlin
rememberViewModelStoreNavEntryDecorator()

Scopes ViewModels to each navigation entry.


Adaptive Navigation

Navigation 3 integrates with Material Adaptive layouts.

kotlin
NavDisplay(

    backStack = backStack,

    sceneStrategy = rememberListDetailSceneStrategy()

)

Use adaptive scene strategies to automatically switch between:

  • Single pane (phones)
  • Two pane (tablets)
  • Foldables

Deep links should resolve into navigation keys.

kotlin
fun handleDeepLink(uri: Uri) {

    val userId =
        uri.lastPathSegment ?: return

    backStack += Profile(userId)
}

Avoid manually constructing route strings.


Animations

Navigation transitions are defined using scene transitions.

kotlin
NavDisplay(

    backStack = backStack,

    transitionSpec = {

        fadeIn() togetherWith fadeOut()

    }
)

Navigation 3 animation APIs may evolve while in alpha.


Show full SKILL.md (154 more words)Show less

State Restoration

Navigation keys are serializable and automatically restored.

kotlin
val backStack = rememberSaveable(
    saver = navBackStackSaver()
) {
    mutableStateListOf(Home)
}

Always ensure keys are serializable.


Testing

Navigation becomes simple because it is state-driven.

Example
kotlin
@Test
fun navigateToProfile() {

    val backStack =
        mutableStateListOf<Any>(Home)

    backStack += Profile("123")

    assertEquals(
        Profile("123"),
        backStack.last()
    )
}

Compose UI tests can verify screen rendering by inspecting the current back stack.


Migration from Navigation Compose

Navigation ComposeNavigation 3
NavControllerMutable back stack
NavHostNavDisplay
navigate()backStack += Key
popBackStack()removeLast()
String routesSerializable keys
composable()when(key)
Navigation graphState-driven destinations

navigation/

    AppNavigation.kt

    NavigationKeys.kt

    NavigationDisplay.kt

feature/

    home/

    profile/

    settings/

Critical Rules

DO
  • Use immutable serializable keys
  • Keep navigation state inside Compose
  • Pass IDs instead of complex objects
  • Scope ViewModels using entry decorators
  • Use rememberSaveable for state restoration
  • Model navigation as observable application state
DON'T
  • Use string routes
  • Pass repositories or ViewModels through navigation
  • Mutate navigation keys
  • Store business objects in the back stack
  • Recreate the back stack on recomposition
  • Mix Navigation Compose APIs with Navigation 3 APIs

References

  • Android Navigation 3 documentation
  • Navigation 3 samples
  • Lifecycle ViewModel Navigation 3 documentation
  • Material 3 Adaptive Navigation documentation

© new-silvermoon, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in .github/skills/ui/compose-navigation of new-silvermoon/awesome-android-agent-skills.

Open the folder on GitHubat commit 82900ea

Compare with similar skills

Navigation3 next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Navigation3 compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Navigation3 this skillnew-silvermoon/awesome-android-agent-skills972—~1.9kAutomated safety check: PassApache-2.0
Frontend Maestronekomangaorg/Neko2.8k—~1.3kAutomated safety check: PassApache-2.0
Compose Screens Footgunsmaxrave-dev/kotlin-footguns1.1k—~5.5kAutomated safety check: PassGPL-3.0
Android Compose Patternsmakifbaysal/tasktrooper112—~1.9kAutomated safety check: PassApache-2.0
Android Material Guidelineszoonk/zoonk157—~1.1kAutomated safety check: PassMIT
Android Designhashgraph-online/awesome-codex-plugins1.3k—~2.5kAutomated safety check: PassApache-2.0

Similar skills

  • Frontend Maestro

    nekomangaorg/Neko

    Orchestrates macro-level UI architecture, complex Jetpack Compose structures, and screen-to-screen flows.

    2.8k GitHub stars~1.3k tokensUpdated yesterday
    MobileAuto-check passed
  • Compose Screens Footguns

    maxrave-dev/kotlin-footguns

    Compose screen and interaction traps: navigation, adaptive layout, window insets, pagers, toolbars, sheets, list drag and selection, sliders, text fields, settings UI, one-shot effects.

    1.1k GitHub stars~5.5k tokensUpdated 16 days ago
    MobileAuto-check passed
  • Android Compose Patterns

    makifbaysal/tasktrooper

    A skill your agent uses when building native Android with Jetpack Compose - stateless composables, state hoisting, ViewModel-owned state, edge-to-edge, predictive back, adaptive layout, atomic…

    112 GitHub stars~1.9k tokensUpdated yesterday
    MobileAuto-check passed
  • A skill your agent uses when designing, reviewing, or implementing Android UI or features for phones, tablets, foldables, ChromeOS, desktop windowing, Wear OS, Android TV, Android for Cars, Android…

    157 GitHub stars~1.1k tokensUpdated today
    MobileAuto-check passed
  • Android Design

    hashgraph-online/awesome-codex-plugins

    A skill your agent uses when the user asks for an Android app, Compose UI, Material 3, Material You, Material 3 Expressive, Pixel-style app, foldable/adaptive layout, Play Store deliverable, React…

    1.3k GitHub stars~2.5k tokensUpdated yesterday
    MobileAuto-check passed
  • Material 3

    hamen/material-3-skill

    Implement Google's Material Design 3 (Material You) UI system.

    1.5k GitHub starsUsed in 2 repos~7.8k tokens
    Frontend & DesignAuto-check passed

More from new-silvermoon/awesome-android-agent-skills

  • Android Viewmodel

    new-silvermoon/awesome-android-agent-skills

    Best practices for implementing Android ViewModels using Kotlin 2.3+ Explicit Backing Fields, StateFlow for UI state, and SharedFlow for one-off events.

    972 GitHub starsUsed in 1 repo~1k tokens
    Auto-check passed

Works with

Categories

Questions about Navigation3

What does Navigation3 do?

Implement navigation in Jetpack Compose using Navigation 3. An agent skill from new-silvermoon/awesome-android-agent-skills. Navigation3 is an agent skill from new-silvermoon/awesome-android-agent-skills. Implement navigation in Jetpack Compose using Navigation 3.

When should I use Navigation3?

Navigation3 fits situations like: asked to build state-driven navigation; manage back stacks; scope ViewModels; implement adaptive layouts.

How do I install Navigation3 in Claude Code?

Run `npx skills add new-silvermoon/awesome-android-agent-skills --skill navigation3 -a claude-code`. Or copy the skill folder (.github/skills/ui/compose-navigation in new-silvermoon/awesome-android-agent-skills) into .claude/skills/navigation3 in your project. Claude Code loads it when a task matches its description.

How do I install Navigation3 in Codex?

Run `npx skills add new-silvermoon/awesome-android-agent-skills --skill navigation3 -a codex`. Or copy the skill folder (.github/skills/ui/compose-navigation in new-silvermoon/awesome-android-agent-skills) into .agents/skills/navigation3 in your project. Codex loads it when a task matches its description.

Can I use Navigation3 in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add new-silvermoon/awesome-android-agent-skills --skill navigation3 -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/navigation3, .gemini/skills/navigation3, .github/skills/navigation3 and .opencode/skills/navigation3 in your project.

What does Navigation3 need to run?

SKILL.md names no scripts, command-line tools or credentials: Navigation3 is instructions for the agent only.

Does Navigation3 access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Navigation3 safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Navigation3 use?

Navigation3 is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Navigation3 use?

About 1.9k tokens (SKILL.md is roughly 7.7k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Navigation3?

Skills that share tags, products or a category with Navigation3: Frontend Maestro (nekomangaorg/Neko, 2.8k stars), Compose Screens Footguns (maxrave-dev/kotlin-footguns, 1.1k stars), Android Compose Patterns (makifbaysal/tasktrooper, 112 stars) and Android Material Guidelines (zoonk/zoonk, 157 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Navigation3?

new-silvermoon (a GitHub user) maintains it in new-silvermoon/awesome-android-agent-skills, which has 972 GitHub stars. The repository holds 2 skills in this directory. The repository was last updated on July 27, 2026.

Source: new-silvermoon/awesome-android-agent-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.