viewports

A viewport is a window or area through which a portion of a scene or document is viewed. In computing, viewports describe the visible region within a larger space and are used across graphics, web design, and mapping.

In computer graphics, a viewport is defined by a rectangle on the render target. Graphics APIs let developers set its size and origin, to control where in the window the image is drawn. The viewport is used in conjunction with projection and clipping; normalized device coordinates are mapped to window coordinates via the viewport transform. Multiple viewports may be used for split-screen rendering.

In web design, the term commonly refers to the visible portion of a web page within the browser window. CSS provides viewport units (vw, vh, vmin, vmax) representing percentages of the viewport’s width or height. The viewport meta tag in HTML instructs mobile browsers on how to scale and size the page, for example width=device-width, initial-scale=1.

In CAD, GIS, and 3D modeling, a viewport is a window into a model or map. Applications can provide several viewports showing different perspectives (top, side, isometric), enabling interaction with the data while preserving context. In games and simulations, viewports may correspond to a camera view or render target and can be rearranged for split-screen or VR rendering.

Considerations include aspect ratio preservation, scaling, and device pixel ratio, particularly on high-density displays. A misaligned viewport can cause distortion, letterboxing, or clipping, while a properly configured viewport ensures the scene maps correctly to the display surface.