Expanding Cards

Image cards that expand on selection using pure CSS flex-grow transitions, with accessible buttons.

ReactAccordionImage CardsCSS TransitionsAccessible
Open in
  • Snow-covered mountain summit under a clear sky
    Explore the highest peaks and alpine lakes.
  • Empty beach with gentle waves at sunset
    Relax on golden sands by turquoise water.
  • City skyline lit up at dusk
    Experience the skyline after dark.
  • Sunlight filtering through a dense forest
    Discover hidden trails beneath tall pines.
  • Wind-shaped sand dunes in warm light
    Journey through rolling sand dunes.

Install Dependencies

1npx shadcn@latest add https://ui.devsloka.in/r/expanding-cards.json