scaleFrom

Scalefrom is a term used in animation configuration to designate the starting scale factor for an element during a scaling transition. It is not part of the CSS Transform specification; rather, it appears in the configuration objects of various animation libraries and tools, where the developer can specify how large or small an element should be at the start of the animation.

Typically scalefrom is paired with a corresponding scaleTo or end scale; the scale values are dimensionless, and 1.0 represents the element’s original size. The exact interpretation and placement of scalefrom vary by framework, but the core idea is to define the initial size before the element scales to its target size.

Examples of usage can be found in different implementation styles. In a JSON-based animation descriptor, a scalefrom value might appear as { "scaleFrom": 0.3, "scaleTo": 1, "duration": 400 }. In other approaches that use keyframes, the effect is achieved by starting at scale(0.3) in the initial keyframe and ending at scale(1) in the final keyframe.

Naming variations exist: some libraries use startScale or fromScale, and others incorporate scaling within a broader tween or transition descriptor rather than a dedicated scalefrom field. The concept remains a way to control the initial visual size during a scale animation.

Considerations include how scaling interacts with transform-origin, the impact of non-uniform scaling on layout and rendering, and performance implications on different devices. See also scale, transform, keyframe animation, easing, and transition.