> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dwe.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Fit View

> Adjust how the video feed fits within the card.

<Frame caption="Double clicking the video feed or pressing the zoom out button on the top right resets it to the current fit view.">
  <video controls={false} autoPlay loop muted playsInline className="w-full aspect-video" src="https://mintcdn.com/deepwaterexplorationinc/e0wVLTi_h45Y5fkF/discovery/video-card-buttons/images/animations/fitViews.webm?fit=max&auto=format&n=e0wVLTi_h45Y5fkF&q=85&s=dc96cae53a7c505330cffa9c9bed1356" data-path="discovery/video-card-buttons/images/animations/fitViews.webm" />
</Frame>

## Fit views

The button in the top right swaps between the two fit options.

<Columns cols={2}>
  <Card title="Cover view" icon="expand">
    Click <Icon icon="expand" /> to zoom in and remove all blank space.
  </Card>

  <Card title="Contain view" icon="compress">
    Click <Icon icon="compress" /> to fit the feed's native aspect ratio.
  </Card>
</Columns>

## Zoom and pan

You can also adjust the video feed directly:

* <Icon icon="magnifying-glass-plus" /> **Zoom:** scroll wheel
* <Icon icon="up-down-left-right" /> **Pan:** left/right mouse buttons, or click-drag the scroll wheel

<Frame caption="When zoomed, the zoom scale appears in the top right.">
  <img src="https://mintcdn.com/deepwaterexplorationinc/dDpT5_8Eip43UIec/discovery/video-card-buttons/images/zoomScale.png?fit=max&auto=format&n=dDpT5_8Eip43UIec&q=85&s=7bf38d5c8fc802e7eb68952cf9204610" noZoom width="108" height="49" data-path="discovery/video-card-buttons/images/zoomScale.png" />
</Frame>