transform

perspective-origin

Moves the vanishing point that u.perspective() establishes, aiming the 3D effect off-centre; set it on the same parent element that carries u.perspective().

import { perspectiveOrigin } from "@sdxc/u/transform";

Quick reference

Every documented call, beside the CSS it emits.

Call	CSS
`u.perspectiveOrigin()`	`css({ perspectiveOrigin: "center" })`
`u.perspectiveOrigin("top left")`	`css({ perspectiveOrigin: "top left" })`
`u.perspectiveOrigin("25% 75%")`	`css({ perspectiveOrigin: "25% 75%" })`

Using a custom value

Every scale argument also takes a raw CSS value, which passes through untouched.

u.perspectiveOrigin()

Applying on a state

Wrap the call in a state utility to scope it to one selector.

u.hover(u.perspectiveOrigin())

Responsive design

Wrap the call in a container query to scope it to one width.

u.at("md", u.perspectiveOrigin())

Signature

u.perspectiveOrigin(value?: TransformOriginValue)