Custom Cursor

Text cursor

  • Brand Strategy
  • Digital Design
  • Web Development
  • Empty text (shows default cursor)

Image cursor

  • External URL
  • Public file (favicon)
  • Wrong URL - custom cursor won't show

GSAP split-text

Word by wordtype="words" words-class="word"

Each word gets a --word CSS variable (0, 1, 2…) used to stagger the transition delay.

Every word fades up one after another as you scroll into view.

Typing / letter revealtype="chars" chars-class="char"

Each character gets a --char index. step-end makes opacity snap instantly — no fade, pure typing feel.

Crafting digital experiences one pixel at a time.

Line by line (parent trigger)type="lines" lines-class="line"

Lines are calculated from the actual rendered layout, so reflow on resize is handled automatically. All lines trigger together when the parent enters the viewport, staggered by --line.

Design is not just what it looks like and feels like. Design is how it works. Every decision shapes the experience, from the first pixel to the last interaction. Good design is invisible — it gets out of the way and lets the content speak.

Line by line + masktype="lines" lines-class="line" :mask="true"

mask=true wraps each line in an overflow:hidden container. The line slides up inside its own clip — no visible origin below.

Design is not just what it looks like and feels like. Design is how it works. Every decision shapes the experience, from the first pixel to the last interaction. Good design is invisible — it gets out of the way and lets the content speak.

Line by line + mask + per-line scroll triggertype="lines" lines-class="line" :mask="true" :observe-lines="true"

observe-lines=true attaches a separate IntersectionObserver to each line. Each line only animates when it individually enters the viewport.

Design is not just what it looks like and feels like. Design is how it works. Every decision shapes the experience, from the first pixel to the last interaction. Good design is invisible — it gets out of the way and lets the content speak. The best interfaces feel inevitable, as though no other design could exist. Simplicity is not the absence of clutter but the presence of order and intention.

Words + lines kombinacijatype="words,lines" words-class="word" lines-class="line"

Combines both --word and --line indexes. Words in later lines get a larger delay, creating a natural cascading stagger across the whole block.

Each word knows which line it belongs to. This lets you build stagger effects that span across lines with full control over timing and sequence.