Home
Docs
InfinityFX
©Copyright2016-2026 InfinityFX. All rights reserved.
InfinityFX®
Lively
v5.0.0
Getting started
Components
Animate
LayoutGroup
TextAnimation
ViewAnimation
Hooks
useAudio
useHover
useLink
useReducedMotion
useScroll
useSpring
useTap
useViewport
useVisible
Links
v4 docs
llms.txt

Getting started

Installing

1 
npm install @infinityfx/lively

Importing

Lively exports 2 components from @infinityfx/lively, the Animatable and Animate components.

1 
import { Animatable, Animate } from '@infinityfx/lively';

In addition Lively also exports from 2 submodules; @infinityfx/lively/layout and @infinityfx/lively/hooks. These submodules can be used in tandem with the main module and provide extra utilities to help create more complex animations.

1 
import { Typable, Morph, LayoutGroup } from '@infinityfx/lively/layout';

It is important to note that the Animate, Typable and Morph components all build upon the Animatable component, extending its functionality. This means that these components also inherit the properties and functionality of the Animatable component.

Usage

Play a simple fading animation when the component mounts.