UX Movement Newsletter

UX Movement Newsletter

Share this post

UX Movement Newsletter
UX Movement Newsletter
How to Design a Responsive Layout for Your Cards

How to Design a Responsive Layout for Your Cards

Beautiful cards on every device

Apr 03, 2023
∙ Paid
21

Share this post

UX Movement Newsletter
UX Movement Newsletter
How to Design a Responsive Layout for Your Cards
2
Share

A designer’s work doesn’t stop when they finish designing a UI card. They still have to make the cards responsive on every device. If they aren’t responsive, users won’t get a consistent content experience which can decrease their engagement. Making your cards look beautiful across all platforms requires working with developers in a few areas.

Breakpoints

First, developers need to know what the breakpoints are. A breakpoint is the screen width dimension, where the layout will change to adapt to the new screen size. You need breakpoints to accommodate mobile, tablet, and desktop screen sizes.

The optimal breakpoint is the smallest common screen size for each device. If you look up screen resolution stats worldwide, you can see that they are the following:

This post is for paid subscribers

Already a paid subscriber? Sign in
© 2025 Anthony from UX Movement
Privacy ∙ Terms ∙ Collection notice
Start writingGet the app
Substack is the home for great culture

Share