Swipe-to-Delete List Item

Design a mobile list where each row can be swiped horizontally to reveal destructive and secondary actions. Think email inbox, task list, or message list: the content stays in a vertical scroll, but each item carries hidden actions behind it.

Show the list in its resting state with clear row content, then the swipe state where the row shifts enough to expose delete and archive buttons. The gesture should feel native to mobile, not like a desktop menu hidden in a drawer.

The interaction needs to make the action obvious without losing the item’s identity. Users should still recognize what they are acting on while the row is partially displaced, and the revealed buttons should be easy to hit with a thumb.

This challenge is about balancing speed and safety. Deleting should feel immediate, but the UI should make the consequence legible before the tap lands, especially when multiple rows are stacked tightly together.

Use different visual weight for the actions: make delete visually louder than archive, so the destructive choice reads instantly when the row slides.