## Reference images

Study these alongside the description below: hierarchy, rhythm, spacing, colour. Build for the product you are asked about, using this design language.

- Component: https://kage-design-assets.t3.tigrisfiles.io/components/tonebird/16d0d272-e4c0-4394-9450-270e8dcbe6b2-1790229837-0.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/tonebird/16d0d272-e4c0-4394-9450-270e8dcbe6b2-1790229760726-full.webp
- Component on Kage: https://kage.design/component/tonebird-navigation

## Before you start
Ask what the user's product is, who it serves, and what its brand personality and primary conversion action are. Apply the principles below to that product rather than reproducing the reference.

Build a slim, full-width navigation bar. Use a white or near-white background, a small brand mark and wordmark aligned left, and a restrained horizontal link group aligned right. Keep the height compact, use small neutral-gray text, and make the primary download or signup action subtly distinct with a pale border or soft shadow. Align everything to a centered max-width container with generous side padding. Use a clean sans-serif hierarchy, approximately #202329 for text and #6f7678 for secondary links; use 1px #e8eceb borders, 10–14px radius on the action, and a very soft shadow only if needed. Add hover states that darken links and slightly strengthen the action border; collapse links into a menu on small screens.

Never: copy logos, product names, copy, illustrations, or imagery from the reference.