Profile My skills Saved Collections Edit profile Submit a skill

Fx Knowledge Graph

Linked nodes drifting — a data / AI backdrop. A bold, canvas-based effect from Open Design's html-ppt fx pack — for slides and launch videos. Guards prefers-reduced-motion (does not start). One per screen; on web use sparingly.

Nexu 7419f34 5 files · 8.0 KB Updated
Web & Frontend

File contents

Knowledge Graph

Linked nodes drifting — a data / AI backdrop. From Open Design's html-ppt fx pack (Apache-2.0). Part of motion-anything; obeys MOTION-SPEC.md.

When to use it

  • Title cards, section breaks, or hero moments in slides / launch videos.

When NOT to use it (restraint)

  • Web body content or anything needing focused reading. Never more than one bold effect at once.

How to apply

  1. Copy knowledge-graph.js and _util.js and link them.
  2. Add data-fx="knowledge-graph" to a positioned container; call HPX['knowledge-graph'](el) (guard prefers-reduced-motion).

Accessibility & performance

  • Guard with prefers-reduced-motion (don't start). Canvas-based; isolated compositing layer.

nexu-io/motion-anything/tree/main/recipes/slides/fx-knowledge-graph commit 7419f34095

Browse category

Frequently asked questions

npx skillmds@latest add nexu-io/fx-knowledge-graph