Shots: Photo & Video Generator

Colors

• #121215background-dark · screen background · card surface fills
• #0D0D10nav-bar-surface · bottom navigation bar
• #6C4DF6accent-purple · upgrade button · active nav icon fill
• #FFFFFFtext-primary · section headers · card titles
• #8A8A93text-secondary · counts · unselected nav item labels

Type

• hero-titleSF Pro Display · 52px · 800 · #FFFFFF
• section-titleSF Pro Display · 40px · 700 · #FFFFFF
• chip-linkSF Pro Text · 28px · 600 · #121215
• tab-labelSF Pro Text · 20px · 500 · #8A8A93

Elements

• app-header · top-bar

  Fixed top below system bar, horizontal flex layout with logo/title left and upgrade action right · Dark translucent glass with pill-shaped 'Upgrade' button containing sparkle icon

• hero-banner · carousel-banner

  Large rounded hero element below top bar with integrated overlay pill button 'Try Now' and pagination dots · Full photographic backdrop with embedded circular inset preview and text overlay

• section-header-photoshoot · section-heading

  Row with icon and title on left, white pill button 'Go to Studio >' on right · High visual hierarchy heading with rounded white action pill

• preset-grid-cards · card-group

  Horizontally scrollable row containing 2x2 photo collage cards with title and count labels below · Squircle container with 4 inner image quadrants and dark background

• bottom-nav-bar · tab-bar

  Fixed bottom bar spanning screen width with 4 equidistant navigation items: Home, Discover, AI Edit, AI Video · Dark charcoal background, selected tab highlighted with purple icon and white label

Layout

Content-rich home feed with top navigation, featured carousel banner, sectioned horizontal content rows, and a fixed bottom tab bar.

Notes

Standard iOS style tab bar and navigation hierarchy. Multiple card grids support horizontal scrolling.