splitformac.com
Design analysis
A compact sticky-style header establishes the product identity, primary navigation, and two utility actions without competing with the hero.
Prompt preview
## 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/split/8556c614-105f-4777-9be3-693330882192-1790402625-0.webp - Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/split/8556c614-105f-4777-9be3-693330882192-1790402544582-full.webp - Component on Kage: https://kage.design/component/split-navigation ## Before you start Ask what the user's product is, who it is for, and what their brand style should feel like. Apply the principles below to that product rather than copying this reference. Build a compact desktop navigation bar spanning the viewport. Keep the brand mark and name aligned left, place a small set of explanatory/product links beside it, and align account and primary purchase actions to the right. Use a white background, near-black text around #07151d, muted gray secondary text around #68727a, and a very thin accent rule at the top around #e94375. Use a clean sans-serif, 12–14px navigation text, generous horizontal padding, and a 1px bottom border or very subtle shadow. Make the primary action a dark rounded pill with white text; make the secondary action quiet and text-based. Preserve keyboard focus states and collapse links into a mobile menu. Never use the reference's logos, product names, copy, illustrations, imagery, or exact visual assets.
kage