Layout / frame

frame

Tier 0

Hold an aspect ratio; crop media to fit. Uniform thumbnails from chaotic images.

16:9 (default)

square

4:3

--ratio: 21/9

<m-frame ratio="square">
  <img src="photo.jpg" alt="…">
</m-frame>

Attributes

ratio: square · 16:9 · 4:3 · 3:2 · 2:1 · 9:16 — or any fraction via --ratio. Direct img/video children (and picture > img) fill and crop with object-fit: cover; anything else is centered in the shape.