## 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/composio-instant/90b73b03-e2b9-4385-8074-6e8e2bc32f62-1792562871-0.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/composio-instant/90b73b03-e2b9-4385-8074-6e8e2bc32f62-1792562787795-full.webp
- Component on Kage: https://kage.design/component/composio-instant-navigation

## Before you start
Ask what the user's product is, who it serves, and what its brand voice and visual identity are. Apply the following principles to that product rather than copying the reference.

Build a compact desktop-first top navigation. Use a white background, a small brand mark and product badge on the left, evenly spaced uppercase or small all-caps links in the middle, and two right-aligned actions: a subtle outlined login button and a high-contrast dark primary button. Keep the header around 48px tall with 14–20px horizontal padding, 1px bottom border, tight 12–13px typography, and restrained letter spacing. Make the navigation responsive: collapse links into a menu on small screens while retaining the primary action.

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