---
name: atomic-example-navigation-bar
description: Example decomposition for generating a responsive Navigation Bar with Atomic Bomb.
---

# Example: Navigation Bar

User request:

```text
Create a responsive Navigation Bar.
```

## Decomposition

Atoms:

- Logo
- Icon
- Button

Molecules:

- MenuItem
- MenuToggle

Organism:

- Menu

## Commands

```shell
npx atomic-bomb --type atom --name Logo,Icon,Button
npx atomic-bomb --type molecule --name MenuItem,MenuToggle
npx atomic-bomb --type organism --name Menu
```

## Done Criteria

- Menu has desktop and mobile states.
- Icon-only controls have accessible labels.
- Keyboard interaction is tested.
- MenuItem can be reused by other navigation organisms.