Object Fit 1.2.2

Control how replaced elements like <img> and <video> are resized within their container. Deutsch: Object Fit

Maturity: Documented as stable in VelinStyle 1.2.0. Studio and the complete Utility Engine remain planned — shipping utilities are hand-authored under @layer utilities, not a full variant generator.

When to use

Fit media in fixed frames with object-fit / object-position utilities.

When not

Pair with explicit sizes or aspect-ratio helpers so layout does not jump.

Object Fit

<img class="velin-object-fit-contain" src="..." alt="...">
<img class="velin-object-fit-cover" src="..." alt="...">
<img class="velin-object-fit-fill" src="..." alt="...">
<img class="velin-object-fit-scale-down" src="..." alt="...">
<img class="velin-object-fit-none" src="..." alt="...">

Object Position

Set the alignment of the element's content within its box:

<img class="velin-object-fit-cover velin-object-position-top" src="..." alt="...">
<img class="velin-object-fit-cover velin-object-position-center" src="..." alt="...">
<img class="velin-object-fit-cover velin-object-position-bottom" src="..." alt="...">

Responsive

All object-fit utilities support responsive breakpoints:

<img class="velin-object-fit-contain velin-object-fit-md-cover" src="..." alt="...">