Layout

hero image

These articles help you create a flexible UI that looks great on different screen sizes, window sizes, resolutions, and orientations.

Page layout

Walk through a basic page layout structure.

Screen sizes and breakpoints

Learn about screen sizes across the Windows 10 ecosystem and how to design for breakpoints.

Responsive design techniques

Learn about responsive design techniques that optimize your app's layout for breakpoints.

Layouts with XAML

Implement responsive UI in XAML with adaptive or tailored layouts.

Multiple views

Show independent parts of your app in separate windows.

Alignment, margin, padding

Use alignment, margin, and padding to influence layout behavior.

Layout panels

Learn about each type of layout panel an how to use them to arrange UI elements.

Transforms

Use transforms to rotate, skew, and scale elements.