Kage Design logo kage
parthjadhav.com
App Store Screenshots gallery component

Design analysis

A pale section demonstrates localized variations through a compact tab control and a single horizontal strip of related screenshots, followed by a clear app identity caption.

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/app-store-screenshots/ebba8a13-8dd3-48a7-9b23-a1c0db4171af-1793253671-4.webp
- Full page it was cut from: https://kage-design-assets.t3.tigrisfiles.io/screenshots/app-store-screenshots/ebba8a13-8dd3-48a7-9b23-a1c0db4171af-1793253637144-full.webp
- Component on Kage: https://kage.design/component/app-store-screenshots-gallery-2

## Before you start
Ask what the user's product, brand, locales, translation states, and image variants are, then apply these principles to that product.

Build a language-variation gallery on a very light gray background around #f7f7f8. Center a bold heading and place a compact pill-style tab group beneath it for locale selection. Show one horizontal row of tall screenshots or localized cards with consistent dimensions, spacing, and 10px radii. Beneath the row, add a small identity caption with icon, title, and supporting metadata. Tabs should have a white active state, subtle shadow, clear keyboard focus, and accessible selected states. Keep the section calm and spacious, using near-black headings and medium-gray metadata.

Never:
- use logos, product names, copy, illustrations, or imagery from the reference
- use the reference languages or screenshots
- hide locale changes behind an inaccessible carousel

More components