What is Screen Sizes used for?

Screen Sizes is a reference website for Apple device display specs, including resolutions, logical viewport sizes, and related design dimensions.

Can I use this for responsive UI planning?

Yes. The reference helps you map target breakpoints and validate how interfaces scale across iPhone, iPad, desktop, and watch contexts.

Does it include icon and app asset guidance?

It includes practical size references that are useful when preparing app icons and visual assets for Apple platforms.

Who benefits most from this tool?

Product designers, frontend developers, QA engineers, and teams preparing App Store screenshots can all use it as a quick sizing reference.

Should I still verify final platform requirements?

Yes. Treat this as a fast planning reference and confirm final submission specs in official Apple documentation before release.

Find Apple screen sizes and design specs quickly

Reference Apple device screen sizes, viewport dimensions, pixel resolutions, and icon specs for iPhone, iPad, Mac, and Apple Watch design workflows.

What is Screen Sizes?

Screen Sizes is a practical device-spec lookup tool focused on Apple products. It helps teams quickly check screen dimensions, viewport references, and related asset sizing details while designing interfaces, building responsive layouts, or preparing QA checks. Instead of searching specs one by one, you can keep a single reference open during product work.

Core reference features

Designed for fast lookups during design and development.

Apple-focused coverage: Find common display specifications across iPhone, iPad, Mac, and Apple Watch categories.
Viewport and resolution context: Review both logical and pixel-based dimensions for practical responsive implementation.
Icon size references: Use icon-related dimensions to align visual assets with Apple ecosystem expectations.
Quick lookup flow: Scan essential values quickly instead of checking multiple fragmented resources.
Design-dev handoff support: Give both designers and developers a shared source for sizing discussions.
Planning-friendly information: Use as a baseline when creating mocks, test cases, and screenshot export plans.

How to use Screen Sizes

A straightforward workflow for product teams.

Select your target device family: Start with iPhone, iPad, Mac, or Apple Watch based on your product surface.
Check dimensions and viewport values: Use listed specs to decide layout behavior, breakpoints, and screenshot framing.
Apply specs in design and implementation: Update design files, CSS breakpoints, and QA checks with consistent sizing references.

Tips for better device-spec usage

Turn reference data into better decisions.

Design for ranges, not single devices: Use specs to identify clusters of similar screens and reduce unnecessary one-off layouts.
Separate logical and physical pixels: Keep viewport sizing decisions distinct from export-resolution decisions to avoid confusion.
Use consistent screenshot presets: Create repeatable export templates based on your most important target devices.
Document assumptions in handoff: Record which device references were used so design, dev, and QA stay aligned.

Great for cross-functional teams

Use cases where this reference saves time.

Responsive UI design: Plan layouts with clearer expectations across Apple screen classes.
Frontend implementation: Validate breakpoint choices and viewport behaviors during development.
QA test planning: Define device coverage matrices with concrete dimension references.
App Store assets: Prepare screenshot sizes with fewer trial-and-error export cycles.
Design system docs: Maintain shared platform dimension guidelines for product teams.

Why this reference is useful

Practical gains in everyday product execution.

Faster decision making: Get key values quickly while designing or coding without context switching.
Fewer sizing mistakes: Reduce misaligned assets and layout assumptions across teams.
Cleaner handoffs: Keep designers and developers aligned on concrete device references.
Better planning quality: Build more consistent acceptance criteria for responsive behavior.
Lower rework cost: Catch spec-related issues earlier before final build and QA cycles.

Technical details

How teams typically use this reference data.

Input: Device family selection and spec lookup from Apple-focused screen reference tables.
Process: Compare dimensions, viewport values, and icon sizing information for planning and implementation.
Output: Actionable size references for design files, CSS breakpoints, screenshots, and QA matrices.

Frequently Asked Questions

Have questions? We have answers.