Animate On Scroll

Reveal content as it enters the viewport.

@sigil-ui/componentsReact

Preview

import { AnimateOnScroll } from "@sigil-ui/components";

<AnimateOnScroll>
  <Badge>I animate when scrolled into view</Badge>
</AnimateOnScroll>

Prop	Type	Default	Description
`preset`	`UseSigilAnimateConfig["preset"]`	`fadeUp`	Animation preset.
`delay`	`number`	—	Delay in seconds.
`duration`	`number`	`0.6`	Duration in seconds.

AnimateOnMount

Wrapper that plays a CSS transition on mount (no scroll trigger). Lighter alternative to the GSAP-based AnimateOnScroll for simple mount reveals.

BlurFade

Reveal content with a short blur and fade transition.