Mobile UI design

Card tray

A main card with a darker tray tucked under its bottom edge, showing one line — '3 sessions today'. Tap the tray and it slides down out from under the card to reveal the sessions; the main card does not move a pixel. Tap again and it tucks back.

What it is

A main card with a darker tray tucked under its bottom edge, showing a single teaser line. Tap the tray and it slides out from under the card to reveal the detail — the main card never moves. It is the pattern for 'there is a little more here': today's sessions under a stats card, recent transactions under a balance, sub-tasks under a task. Works anywhere a card wants a secondary layer without a modal or a new screen.

Full library — live sample, numbers, prompt and source — is for clients. I have the password

Seen in

@叨叨AI (Douyin) · 第 7 集「6 种组件交互提升 App 和小程序质感」· 04 组件托盘 Card Tray