transform
transform
can map an input value from one range of values to another.
Usage
Import transform
from Motion.
Note: React users can also use the useTransform hook for use with motion values.
A transformation function can be created by passing two ranges, an input range and an output range:
The transformer can now be called with an input value:
Note:
Both ranges must always be the same length.
The input range must always be a linear series of numbers, either counting up or counting down.
The output range can be a non-linear series of numbers, colors, or complex strings.
The input and output ranges can accept any number of values:
If clamp: false
is provided, the returned function will map infinitely:
A Motion+ membership will give you early access to features & content, access to our private Discord, and more.
It's a one-time fee that grants lifetime access. No subscription necessary!