Content Transition

Playground

Every prop of NumericText, live. Tune the motion and copy the code.

Pick what to show, drag the controls, and every change after that uses the new settings. Type in the box under the preview to try your own text. The code keeps up, listing only the props that differ from the defaults.

Transition

direction
duration
bounce
enterScale
travel

Blur and clipping

blurIntensity

Typography

fontSize
fontWeight
alignment
Preview.tsx
import { NumericText } from 'expo-content-transition';

<NumericText
  value={value}
  fontSize={72}
  fontWeight="600"
  monospacedDigits
  alignment="center"
/>

Only props that differ from the defaults are written. The preview runs the package's own web renderer, so this is the motion you get on the web; iOS and Android follow the same springs.

Where to go next

Transitions

What each motion prop does, side by side.

API reference

Every prop, its type and its default.