Device Sizes for CSS Media Queries

Device Sizes for CSS Media Queries

When dealing with Responsive Web Designs you will have to use @media queries to change the look of your website in different device sizes.

In this blog post, you can find different device sizes you can use with your @media queries.


(min-device-width : 320px) and (max-device-width : 480px)


(min-device-width : 481px) and (max-device-width : 768px)


(min-device-width : 769px) and (max-device-width : 1024px)

IPads pro, Tablets pro

(min-device-width : 1025px) and (max-device-width : 1366px)


(min-device-width : 1367px) and (max-device-width : 1760px)

Large Screen

(min-device-width : 1760px) and (max-device-width : 1920px)

If you found the content I share useful then share it with your developer friends and also follow me on Instagram and Twitter