opentable.com
Design analysis
A softly tinted horizontal callout turns an open-ended search into a guided discovery interaction, pairing a concise heading with several suggested question chips.
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/opentable-com/dad68d84-d5d0-4fa5-a1c8-84465fc5fc04-1789146315-2.webp - Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/opentable-com/dad68d84-d5d0-4fa5-a1c8-84465fc5fc04-1789146276379-full.webp - Component on Kage: https://kage.design/component/opentable-cta ## Before you start Ask what the user's product, audience, and brand are, then apply the principles below to that context rather than reproducing a restaurant-booking site. Build a low-pressure discovery CTA that helps users start an AI or guided search. Follow these rules: - Use a wide, shallow panel with a very subtle cream-to-aqua gradient such as #fff5ed to #e9fbf6, with generous 32px internal spacing. - Arrange a compact text block on the left and a flexible cluster of suggested prompt chips on the right; stack them on mobile. - Use a 20px semibold heading, 13px supporting text, and a tiny muted attribution/status line. Keep copy short and outcome-oriented. - Render suggestions as white or near-white pills/cards with #d9dddf borders, 4–6px radius, 12–13px text, and clear hover/focus treatment. - Ensure the whole component feels optional: no aggressive color, no modal interruption, and no excessive visual noise. Never: use logos, product names, copy, illustrations, imagery, or exact visual assets from the reference.
kage