+
+
+
+
+
+
+
+
+```
+
+
+
+
+
+
+
+
+```
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+
+
+
+
+ To do 4
+
+
+
+ In progress 0
+
+
+
+
+
+
+
+ Marketing
+ Draft onboarding email
+
+
+
+ Video
+ Record product walkthrough
+
+
+
+ Docs
+ Update pricing FAQ
+
+
+
+
+
+
+ Bug
+
+
+
-
+
+
+ var clock = { t: 0 };
+ var tl = gsap.timeline({ paused: true });
+ tl.to(
+ clock,
+ {
+ t: duration,
+ duration: duration,
+ ease: "none",
+ onUpdate: function () {
+ render(clock.t);
+ },
+ },
+ 0,
+ );
+ render(0);
+ tl.seek(0);
+ window.__timelines = window.__timelines || {};
+ window.__timelines[compositionId] = tl;
+ })();
+
@@ -441,12 +702,12 @@ want to change on the element:
| Variable | Default | Accepts | What it does |
| --- | --- | --- | --- |
-| `glyphs` | `░▒▓+·×` | string | Stamp charset; one glyph per stamp is chosen deterministically. |
-| `density` | `med` | `low`, `med`, `high` | Arc-length spacing between stamps along the path. |
-| `path` | `sweep` | `sweep`, `arc`, `zigzag` | Authored travel path preset. |
-| `fade` | `0.8` | number | Per-stamp decay window in seconds, clamped 0.3 to 1.5. |
-| `accent` | `green` | `green`, `blue`, `violet` | Trail and actor color: green rides --brand, blue rides --accent, violet rides --accent-2. |
-| `exit` | `none` | `none`, `fade`, `up` | Optional departure. Default none: the settled actor holds until the frame cuts. |
+| `glyphs` | `` | string | Deprecated and ignored: the trail draws evenly spaced dots. |
+| `density` | `med` | `low`, `med`, `high` | Spacing between trail dots. |
+| `path` | `sweep` | `sweep`, `arc`, `zigzag` | How each move bends: sweep is a gentle curve, arc a deeper one, zigzag a straight line. |
+| `fade` | `0.5` | number | Seconds a step trail takes to fade once the next move begins, clamped 0.3 to 1.5. |
+| `accent` | `green` | `green`, `blue`, `violet` | Trail and step marker color: green rides --brand, blue rides --accent, violet rides --accent-2. |
+| `exit` | `none` | `none`, `fade`, `up` | Optional departure. Default none: the finished screen holds until the frame cuts. |
Set them with `data-variable-values` on the element that mounts it. These are the
defaults, so this behaves exactly like the preview above until you change one:
@@ -455,13 +716,13 @@ defaults, so this behaves exactly like the preview above until you change one:
```
{/* hf:generated-footer */}
-Tagged `motion-primitive` `demonstrate` `trail` `cursor` `glyphs` `deterministic`.
+Tagged `cursor` `motion-primitive` `demonstrate` `trail` `tutorial` `steps` `deterministic`.
## Related topics
diff --git a/docs/catalog/components/cursor-marquee-select.mdx b/docs/catalog/components/cursor-marquee-select.mdx
new file mode 100644
index 0000000000..4f834336fc
--- /dev/null
+++ b/docs/catalog/components/cursor-marquee-select.mdx
@@ -0,0 +1,1132 @@
+---
+title: "Marquee Select Cursor"
+description: "A cursor drags a selection rectangle across a photo grid; each tile rings and pops a check the frame the rectangle touches it, while a pill counts the selection up."
+mode: "frame"
+---
+
+import { CatalogDetail, CatalogSlot } from "/snippets/catalog-detail.jsx";
+import { InstallCommand } from "/snippets/install-command.jsx";
+
+
+
- #root {
- position: absolute;
- inset: 0;
- overflow: hidden;
- container-type: size;
- isolation: isolate;
- color: var(--fg, #f8fafc);
- font-family: var(--font-mono, ui-monospace, "SF Mono", Menlo, Consolas, monospace);
- pointer-events: none;
+
+
-
-
+
+
+
+
+
+
+
+
+
+
+ Notifications
+Choose what we email you, and how often.
+
+
+
+
+
+ Email digest
+ Comments, mentions and file changes in one email.
+
+
+
+
+ Frequency
+ When the digest lands in your inbox.
+
+ DailyWeeklyMonthly
+
+
+
+
+
+
+ Mentions
+ Email me right away when someone mentions me.
+
+ Cancel
+ Save changesSaved
+
+ 1
+ 2
+ 3
+
+
+
+
+
+
+
+
+
+
+```
+
+
+
+
+
+
+ Summer shoot
+ 12 photos, edited yesterday
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+
+ ![]()
+
+
+
+
+
+
+
+ Overview
+Revenue
+Customers
+Invoices
+Settings
+Revenue
+ Updated 2 minutes ago
+
+ Last 30 days
+
+
+
+ Export
+ Exporting…
+ Exported
+
+
+ Net revenue$84,210
+
+
+ Active customers1,284
+
+
+ Churn2.1%
+
+
+
+
+
+ Aug 25 $3,920
+
+
+ Top plans
+
+
+
+
+
+
+
+
+ CustomerPlanAmount
+
+
+ Northwind OutfittersTeam$1,240
+
+
+ Lumen DentalStarter$320
+
+
+ Parkside StudioBusiness$2,880
+
+
+
+
+
+
+
+
+```
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+```
+
+
+
+
+
+
+
+
+
+
+```
+
+
+
Q1KmC1Y
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
literal 0
HcmV?d00001
diff --git a/docs/public/catalog/assets/f664c5b9216de5d0.woff2 b/docs/public/catalog/assets/f664c5b9216de5d0.woff2
new file mode 100644
index 0000000000000000000000000000000000000000..f14c0bf71a366976678a3297706b73ee4218594d
GIT binary patch
literal 32228
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
-
-
+
@@ -231,11 +179,7 @@ import { InstallCommand } from "/snippets/install-command.jsx";
const q = (s) => Math.max(1, Math.round(s * FPS)) / FPS;
const clamp = (v, lo, hi) => Math.min(hi, Math.max(lo, v));
- // Coordinate law from the spec: the actor wrapper owns x/y
- // (absolute position), the core owns press scale and the
- // depth/lift offset, the contact shadow owns only its own opacity
- // and scaleX, the root pulse owns only its own position/opacity/
- // scale. Never tween two meanings on one transform channel.
+ // The actor owns x/y and opacity, the core owns scale.
function buildTouchIndicator(tl, root, { at = 0, elasticity = 1 } = {}) {
const defaults = { gesture: "tap", polarity: "light", targetX: 50, targetY: 55 };
// Per-instance overrides (a host's data-variable-values) land in
@@ -249,10 +193,8 @@ import { InstallCommand } from "/snippets/install-command.jsx";
? window.__hyperframes.getVariables()
: window.__hfVariables || {};
const vars = Object.assign({}, defaults, resolved);
- const pulse = root.querySelector(".hf-touch-indicator__pulse");
const actor = root.querySelector(".hf-touch-indicator__actor");
const core = root.querySelector(".hf-touch-indicator__core");
- const contact = root.querySelector(".hf-touch-indicator__contact");
if (vars.polarity === "dark") actor.classList.add("hf-touch-indicator__actor--dark");
// Compute layout geometry once at setup, never inside an ease/callback.
@@ -260,11 +202,9 @@ import { InstallCommand } from "/snippets/install-command.jsx";
const hostH = root.clientHeight || 1;
const x0 = (vars.targetX / 100) * hostW;
const y0 = (vars.targetY / 100) * hostH;
- tl.set(pulse, { x: x0, y: y0, xPercent: -50, yPercent: -50 }, at);
// --- IN: fixed, never stretched. ---
- const approach = q(0.09);
- const down = q(0.08);
+ const appear = q(0.06);
tl.fromTo(
actor,
{ x: x0, y: y0, xPercent: -50, yPercent: -50, autoAlpha: 0 },
@@ -274,7 +214,7 @@ import { InstallCommand } from "/snippets/install-command.jsx";
xPercent: -50,
yPercent: -50,
autoAlpha: 1,
- duration: approach,
+ duration: appear,
ease: "power2.out",
immediateRender: false,
},
@@ -282,59 +222,16 @@ import { InstallCommand } from "/snippets/install-command.jsx";
);
tl.fromTo(
core,
- { y: -10, scale: 0.72 },
- { y: 0, scale: 1, duration: approach, ease: "power2.out", immediateRender: false },
+ { scale: 0.9 },
+ { scale: 1, duration: appear, ease: "power2.out", immediateRender: false },
at,
);
-
- const touchDown = at + approach; // sync point: fixed +0.083s into IN
- const coreDownScale = vars.gesture === "swipe" ? 0.86 : 0.82;
- tl.fromTo(
- core,
- { scale: 1 },
- { scale: coreDownScale, duration: down, ease: "power2.in", immediateRender: false },
- touchDown,
- );
- tl.fromTo(
- contact,
- { autoAlpha: 0, scaleX: 0.62, xPercent: -50, yPercent: -50 },
- {
- autoAlpha: 0.34,
- scaleX: 1,
- xPercent: -50,
- yPercent: -50,
- duration: down,
- ease: "power2.in",
- immediateRender: false,
- },
- touchDown,
- );
- // Built-in root pulse: same-frame acknowledgement so the
- // gesture reads even with no host UI wired to react to it.
- tl.fromTo(
- pulse,
- { autoAlpha: 0, scale: 0.4 },
- {
- autoAlpha: 0.35,
- scale: 1,
- duration: down,
- ease: "power2.out",
- immediateRender: false,
- },
- touchDown,
- );
- tl.to(
- pulse,
- { autoAlpha: 0, scale: 1.4, duration: q(0.24), ease: "power2.out" },
- touchDown + down,
- );
-
- const inEnd = at + approach + down;
+ const touchDown = at + appear;
// --- HOLD: the only elastic phase. Stretch it, never gsap.timeScale(). ---
let holdEnd;
if (vars.gesture === "swipe") {
- // RETIME RANGE: 0.28s - 0.52s per the swipe law. elasticity scales pacing.
+ // a swipe lasts 0.28s to 0.52s; elasticity scales its pacing.
const swipeDuration = q(clamp(0.34 * elasticity, 0.28, 0.52));
const travel = hostH * 0.4; // vertical scroll, 40% of host height (32-68% allowed)
const accel = q(swipeDuration * 0.41);
@@ -345,47 +242,22 @@ import { InstallCommand } from "/snippets/install-command.jsx";
actor,
{ x: x0, y: y0 },
{ x: x0, y: bendY, duration: accel, ease: "power2.in", immediateRender: false },
- inEnd,
+ touchDown,
);
- tl.to(actor, { x: x0, y: endY, duration: decel, ease: "power3.out" }, inEnd + accel);
- holdEnd = inEnd + swipeDuration;
- } else {
- // RETIME RANGE: 0.02s - 0.10s. A brief contact dwell, never a
- // long-press (long-press is a distinct gesture with its own
- // progress-ring recognizer).
- const holdDuration = q(clamp(0.02 * elasticity, 0.02, 0.1));
- holdEnd = inEnd + holdDuration;
- }
-
- // --- OUT: fixed, never stretched. ---
- if (vars.gesture === "swipe") {
- const liftDuration = q(0.12);
- tl.to(contact, { autoAlpha: 0, duration: q(0.08), ease: "power2.out" }, holdEnd);
tl.to(
- core,
- { y: -10, scale: 0.74, duration: liftDuration, ease: "power2.in" },
- holdEnd,
+ actor,
+ { x: x0, y: endY, duration: decel, ease: "power3.out" },
+ touchDown + accel,
);
- tl.to(actor, { autoAlpha: 0, duration: liftDuration, ease: "power2.in" }, holdEnd);
- return { touchDown, holdStart: inEnd, holdEnd, settle: holdEnd + liftDuration };
+ holdEnd = touchDown + swipeDuration;
+ } else {
+ // a tap touches for 0.08s to 0.2s; any longer reads as a long-press.
+ holdEnd = touchDown + q(clamp(0.12 * elasticity, 0.08, 0.2));
}
- const release = q(0.16);
- tl.to(core, { scale: 1, duration: release, ease: "power2.out" }, holdEnd);
- tl.to(
- contact,
- { autoAlpha: 0, scaleX: 0.72, duration: q(0.12), ease: "power2.out" },
- holdEnd,
- );
- const liftStart = holdEnd + release; // 0s gap, within the spec's <=0.04s allowance
- const liftDuration = q(0.12);
- tl.to(
- core,
- { y: -10, scale: 0.74, duration: liftDuration, ease: "power2.in" },
- liftStart,
- );
- tl.to(actor, { autoAlpha: 0, duration: liftDuration, ease: "power2.in" }, liftStart);
- return { touchDown, holdStart: inEnd, holdEnd, settle: liftStart + liftDuration };
+ // --- OUT: fixed, never stretched. ---
+ const lift = q(0.2);
+ tl.to(actor, { autoAlpha: 0, duration: lift, ease: "power1.in" }, holdEnd);
}
// Self-driving mount: build the paused timeline and register it
@@ -447,7 +319,7 @@ defaults, so this behaves exactly like the preview above until you change one:
{/* hf:generated-footer */}
-Tagged `motion-primitive` `mobile` `gesture` `touch` `pointer`.
+Tagged `cursor` `motion-primitive` `mobile` `gesture` `touch` `pointer`.
## Related topics
diff --git a/docs/catalog/components/ui-focus-zoom.mdx b/docs/catalog/components/ui-focus-zoom.mdx
index b6a9950ed0..73a3a015cc 100644
--- a/docs/catalog/components/ui-focus-zoom.mdx
+++ b/docs/catalog/components/ui-focus-zoom.mdx
@@ -14,7 +14,7 @@ import { InstallCommand } from "/snippets/install-command.jsx";
title="UI Focus Zoom"
description="A full app surface establishes with one settle, then the camera zooms and pans to an anchored region on its cue and holds the zoomed state, with an optional soft focus halo at the anchor. The surface is a slot with a token-styled skeleton default."
variables={[{"id":"anchor_x","type":"number","role":"content","label":"Anchor X","description":"Focus anchor, percent from the left edge of the surface.","default":64,"min":0,"max":100,"step":1,"unit":"%"},{"id":"anchor_y","type":"number","role":"content","label":"Anchor Y","description":"Focus anchor, percent from the top edge of the surface.","default":36,"min":0,"max":100,"step":1,"unit":"%"},{"id":"zoom","type":"number","role":"content","label":"Zoom","description":"Camera scale at the focused state.","default":1.6,"min":1,"max":3,"step":0.05},{"id":"zoom_at","type":"number","role":"timing","label":"Zoom at","description":"Seconds from mount start when the camera departs for the anchor. Clamped inside the hold.","default":1.4,"min":0,"max":30,"step":0.1,"unit":"s"},{"id":"halo","type":"enum","role":"style","label":"Halo","description":"Soft accent bloom at the anchor as the camera arrives.","default":"show","options":[{"value":"show","label":"Show"},{"value":"hide","label":"Hide"}]},{"id":"accent","type":"enum","role":"style","label":"Accent","description":"Token the halo and skeleton accent elements ride.","default":"green","options":[{"value":"green","label":"Green"},{"value":"blue","label":"Blue"},{"value":"violet","label":"Violet"}]},{"id":"exit","type":"enum","role":"style","label":"Exit","description":"Optional departure. None holds the final frame.","default":"none","options":[{"value":"none","label":"None"},{"value":"fade","label":"Fade"},{"value":"up","label":"Up"}]}]}
- meta={{"category":"Camera & 3D","badge":"Stable","codeLines":564}}
+ meta={{"category":"Camera","badge":"Stable","codeLines":564}}
attribution={{"path":"registry/components/ui-focus-zoom","tags":["camera","product-demo","zoom","focus","pan","slot","servo"]}}
hasCode
rawUrl="https://raw.githubusercontent.com/heygen-com/hyperframes/main/registry/components/ui-focus-zoom/ui-focus-zoom.html"
diff --git a/docs/catalog/components/yt-camera-move.mdx b/docs/catalog/components/yt-camera-move.mdx
index 7ed304eb05..15a6891a8e 100644
--- a/docs/catalog/components/yt-camera-move.mdx
+++ b/docs/catalog/components/yt-camera-move.mdx
@@ -14,7 +14,7 @@ import { InstallCommand } from "/snippets/install-command.jsx";
title="Camera Punch-In"
description="Dynamic zoom, slide, and 3D tilt-pan helpers for any wrapper (video, include, card) with cubic-easing defaults and an edge-defocus pulse overlay"
variables={[]}
- meta={{"category":"Camera & 3D","badge":"Stable","codeLines":175}}
+ meta={{"category":"Camera","badge":"Stable","codeLines":175}}
attribution={{"path":"registry/components/yt-camera-move","tags":["camera","zoom","effect","creator"]}}
hasCode
rawUrl="https://raw.githubusercontent.com/heygen-com/hyperframes/main/registry/components/yt-camera-move/yt-camera-move.html"
diff --git a/docs/docs.json b/docs/docs.json
index eab955b7ae..6631f5a2a6 100644
--- a/docs/docs.json
+++ b/docs/docs.json
@@ -257,17 +257,35 @@
"pages": [
"catalog/index",
{
- "group": "3D motion",
- "tag": "7",
+ "group": "3D",
+ "tag": "11",
"expanded": false,
"pages": [
- "catalog/blocks/canopy-part-title",
- "catalog/blocks/code-slice-hero",
- "catalog/blocks/cuboid-carousel",
- "catalog/blocks/frost-sequence-camera-orbit",
- "catalog/blocks/glass-shard-title",
- "catalog/blocks/orbit-card",
- "catalog/blocks/wireframe-portal-title"
+ {
+ "group": "3D motion",
+ "tag": "7",
+ "expanded": false,
+ "pages": [
+ "catalog/blocks/canopy-part-title",
+ "catalog/blocks/code-slice-hero",
+ "catalog/blocks/cuboid-carousel",
+ "catalog/blocks/frost-sequence-camera-orbit",
+ "catalog/blocks/glass-shard-title",
+ "catalog/blocks/orbit-card",
+ "catalog/blocks/wireframe-portal-title"
+ ]
+ },
+ {
+ "group": "3D objects",
+ "tag": "4",
+ "expanded": false,
+ "pages": [
+ "catalog/blocks/exploded-stack",
+ "catalog/blocks/extruded-logo",
+ "catalog/blocks/glass-hero",
+ "catalog/blocks/product-turntable"
+ ]
+ }
]
},
{
@@ -340,6 +358,7 @@
"catalog/components/bottom-up-letters",
"catalog/components/caption-blend-difference",
"catalog/components/char-slam-explode",
+ "catalog/components/colorama-wipe",
"catalog/components/extended-keyframe",
"catalog/components/focus-blur-resolve",
"catalog/components/headline-slam",
@@ -369,7 +388,6 @@
"catalog/components/soft-blur-in",
"catalog/blocks/split-flap-board",
"catalog/components/strikethrough-replace",
- "catalog/components/text-match-cut",
"catalog/components/text-shimmer",
"catalog/components/ticker-takeover",
"catalog/components/titlecard-calm",
@@ -522,7 +540,7 @@
},
{
"group": "Scenes & demos",
- "tag": "95",
+ "tag": "91",
"expanded": false,
"pages": [
{
@@ -556,19 +574,17 @@
},
{
"group": "Product Demo",
- "tag": "22",
+ "tag": "20",
"expanded": false,
"pages": [
"catalog/components/browser-device-stage",
"catalog/components/code-terminal-run",
- "catalog/components/cursor-glyph-trail",
"catalog/components/echo-trail",
"catalog/components/focus-swap",
"catalog/components/icon-morph-beat",
"catalog/components/native-notification-pop",
"catalog/components/notification-stack",
"catalog/components/offset-path-traveler",
- "catalog/components/press-ripple",
"catalog/components/pull-to-refresh",
"catalog/components/screen-flow-carousel",
"catalog/components/segmentation-flood",
@@ -603,7 +619,7 @@
},
{
"group": "Motion Scenes",
- "tag": "40",
+ "tag": "38",
"expanded": false,
"pages": [
"catalog/components/aurora-drift",
@@ -627,7 +643,6 @@
"catalog/components/multi-device-splay",
"catalog/components/notes-typing",
"catalog/components/outline-draw",
- "catalog/components/oversized-cursor",
"catalog/components/particle-image-reveal",
"catalog/components/physical-exit",
"catalog/components/radial-surround",
@@ -641,7 +656,6 @@
"catalog/components/svg-stroke-trace",
"catalog/components/swipe-rail",
"catalog/components/testimonial-proof-card",
- "catalog/components/touch-indicator",
"catalog/components/trust-strip",
"catalog/components/variable-font-flex",
"catalog/components/velocity-throw-snap",
@@ -650,14 +664,35 @@
}
]
},
+ {
+ "group": "Cursors",
+ "tag": "14",
+ "expanded": false,
+ "pages": [
+ "catalog/components/agent-cursor",
+ "catalog/components/cursor-annotate",
+ "catalog/components/cursor-context-menu",
+ "catalog/components/cursor-drag-drop",
+ "catalog/components/cursor-glyph-trail",
+ "catalog/components/cursor-marquee-select",
+ "catalog/components/cursor-text-select",
+ "catalog/components/cursor-zoom-follow",
+ "catalog/components/dart-cursor",
+ "catalog/components/magnetic-cursor",
+ "catalog/components/multiplayer-cursors",
+ "catalog/components/oversized-cursor",
+ "catalog/components/press-ripple",
+ "catalog/components/touch-indicator"
+ ]
+ },
{
"group": "Motion & effects",
- "tag": "94",
+ "tag": "96",
"expanded": false,
"pages": [
{
"group": "Motion Primitives",
- "tag": "30",
+ "tag": "29",
"expanded": false,
"pages": [
"catalog/components/arc-motion-path",
@@ -676,7 +711,6 @@
"catalog/components/page-slide",
"catalog/components/separator",
"catalog/components/sheet-spring-up",
- "catalog/components/simulated-cursor",
"catalog/components/skeleton-reveal",
"catalog/components/slot-machine-roll",
"catalog/components/staggered-fade-up",
@@ -694,7 +728,7 @@
},
{
"group": "Effects",
- "tag": "53",
+ "tag": "56",
"expanded": false,
"pages": [
"catalog/components/avatar-cloud",
@@ -703,6 +737,7 @@
"catalog/components/camera-rig-depth-stack",
"catalog/components/comparison-split",
"catalog/components/confetti",
+ "catalog/components/curtain-reveal",
"catalog/components/cut-the-curve",
"catalog/components/device-frame-stage",
"catalog/components/directional-wipe",
@@ -723,12 +758,12 @@
"catalog/components/mk-usage-arc",
"catalog/components/morph-swap",
"catalog/components/motion-blur",
- "catalog/components/multiplayer-cursors",
"catalog/components/notification-pileup",
"catalog/components/onboarding-stepper-flow",
"catalog/components/ordered-dither-pass",
"catalog/components/overwhelm-surround",
"catalog/components/panel-reveal",
+ "catalog/components/paper-collage-reveal",
"catalog/components/parallax-device-dive",
"catalog/components/parallax-unzoom",
"catalog/components/parallax-zoom",
@@ -743,6 +778,8 @@
"catalog/components/svg-mask-reveal",
"catalog/components/tabs-slide-indicator",
"catalog/components/testimonial-card",
+ "catalog/components/text-match-cut",
+ "catalog/components/torn-paper-rip",
"catalog/components/type-match-cut",
"catalog/components/vignette",
"catalog/components/whip-pan-cut",
@@ -753,7 +790,7 @@
]
},
{
- "group": "Camera & 3D",
+ "group": "Camera",
"tag": "11",
"expanded": false,
"pages": [
@@ -813,7 +850,7 @@
},
{
"group": "Blocks",
- "tag": "14",
+ "tag": "16",
"expanded": false,
"pages": [
"catalog/blocks/flowchart",
@@ -827,7 +864,9 @@
"catalog/blocks/mk-placeholder-grid",
"catalog/blocks/mk-progress-stat",
"catalog/blocks/mk-specs-list",
+ "catalog/blocks/snow",
"catalog/blocks/spiral-galaxy",
+ "catalog/blocks/starfield",
"catalog/blocks/yt-logo-intro",
"catalog/blocks/yt-vertical-fill"
]
diff --git a/docs/public/catalog-index.json b/docs/public/catalog-index.json
index e2e43d28d5..9604833c6f 100644
--- a/docs/public/catalog-index.json
+++ b/docs/public/catalog-index.json
@@ -1,4 +1,20 @@
[
+ {
+ "name": "agent-cursor",
+ "type": "component",
+ "title": "Agent Cursor",
+ "description": "An AI agent operating a UI: a cursor with an accent name label that types out each step, clicks each target with a small ring, and ends on a check.",
+ "tags": [
+ "cursor",
+ "motion-primitive",
+ "agent",
+ "ai",
+ "status",
+ "click"
+ ],
+ "href": "/catalog/components/agent-cursor",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/agent-cursor.png"
+ },
{
"name": "ai-chat-reveal",
"type": "block",
@@ -245,6 +261,8 @@
"prop",
"ui-props",
"compare",
+ "comparison",
+ "split-screen",
"holdable",
"before-after",
"wipe",
@@ -420,7 +438,7 @@
"name": "caption-blend-difference",
"type": "component",
"title": "Blend Difference",
- "description": "Auto-inverting text using mix-blend-mode: difference \u2014 flips between white and black per-pixel against the background",
+ "description": "Auto-inverting text using mix-blend-mode: difference — flips between white and black per-pixel against the background",
"tags": [
"text",
"text-effect",
@@ -644,7 +662,7 @@
"name": "caption-texture",
"type": "component",
"title": "Texture",
- "description": "Flowing texture mask over large uppercase text \u2014 ships with 6 textures (lava, marble, metal, wood, concrete, rock), configurable via the texture variable",
+ "description": "Flowing texture mask over large uppercase text — ships with 6 textures (lava, marble, metal, wood, concrete, rock), configurable via the texture variable",
"tags": [
"captions",
"caption-style",
@@ -917,7 +935,7 @@
"name": "carousel-text-circle-1",
"type": "block",
"title": "Text + Circle Carousel 1",
- "description": "A headline mask-reveals word by word while a circle carousel converges from off-frame and threads the line, collapses to centre, hard-cuts to a second line that arrives at 1.4\u00d7 (Circle style 1).",
+ "description": "A headline mask-reveals word by word while a circle carousel converges from off-frame and threads the line, collapses to centre, hard-cuts to a second line that arrives at 1.4× (Circle style 1).",
"tags": [
"carousel",
"title-card",
@@ -933,7 +951,7 @@
"name": "carousel-text-circle-2",
"type": "block",
"title": "Text + Circle Carousel 2",
- "description": "A headline mask-reveals word by word while a circle carousel converges from off-frame and threads the line, collapses to centre, hard-cuts to a second line that arrives at 1.4\u00d7 (Circle style 2).",
+ "description": "A headline mask-reveals word by word while a circle carousel converges from off-frame and threads the line, collapses to centre, hard-cuts to a second line that arrives at 1.4× (Circle style 2).",
"tags": [
"carousel",
"title-card",
@@ -949,7 +967,7 @@
"name": "carousel-text-circle-3",
"type": "block",
"title": "Text + Circle Carousel 3",
- "description": "A headline mask-reveals word by word while a circle carousel converges from off-frame and threads the line, collapses to centre, hard-cuts to a second line that arrives at 1.4\u00d7 (Circle style 3).",
+ "description": "A headline mask-reveals word by word while a circle carousel converges from off-frame and threads the line, collapses to centre, hard-cuts to a second line that arrives at 1.4× (Circle style 3).",
"tags": [
"carousel",
"title-card",
@@ -965,7 +983,7 @@
"name": "carousel-text-circle-4",
"type": "block",
"title": "Text + Circle Carousel 4",
- "description": "A headline mask-reveals word by word while a circle carousel converges from off-frame and threads the line, collapses to centre, hard-cuts to a second line that arrives at 1.4\u00d7 (Circle style 4).",
+ "description": "A headline mask-reveals word by word while a circle carousel converges from off-frame and threads the line, collapses to centre, hard-cuts to a second line that arrives at 1.4× (Circle style 4).",
"tags": [
"carousel",
"title-card",
@@ -981,7 +999,7 @@
"name": "carousel-text-circle-5",
"type": "block",
"title": "Text + Circle Carousel 5",
- "description": "A headline mask-reveals word by word while a circle carousel converges from off-frame and threads the line, collapses to centre, hard-cuts to a second line that arrives at 1.4\u00d7 (Circle style 5).",
+ "description": "A headline mask-reveals word by word while a circle carousel converges from off-frame and threads the line, collapses to centre, hard-cuts to a second line that arrives at 1.4× (Circle style 5).",
"tags": [
"carousel",
"title-card",
@@ -1209,7 +1227,7 @@
"name": "code-3d-extrude",
"type": "block",
"title": "Code 3D Extrude",
- "description": "Syntax-highlighted code on a lit, beveled 3D slab that rotates through real space and settles to a readable rest \u2014 true WebGL depth and lighting, not a 2D transform.",
+ "description": "Syntax-highlighted code on a lit, beveled 3D slab that rotates through real space and settles to a readable rest — true WebGL depth and lighting, not a 2D transform.",
"tags": [
"code",
"code-animation",
@@ -1224,7 +1242,7 @@
"name": "code-diff",
"type": "block",
"title": "Code Diff",
- "description": "An edit shown as a colored diff \u2014 removed lines collapse in red, added lines expand in green.",
+ "description": "An edit shown as a colored diff — removed lines collapse in red, added lines expand in green.",
"tags": [
"code",
"code-animation",
@@ -1238,7 +1256,7 @@
"name": "code-highlight",
"type": "block",
"title": "Code Highlight Sweep",
- "description": "A highlight band sweeps across a target line while the surrounding context dims \u2014 draws the eye to one line.",
+ "description": "A highlight band sweeps across a target line while the surrounding context dims — draws the eye to one line.",
"tags": [
"code",
"code-animation",
@@ -1252,7 +1270,7 @@
"name": "code-morph",
"type": "block",
"title": "Code Morph",
- "description": "One snippet transforms into another \u2014 tokens glide between positions, leavers fade out, enterers fade in. Shiki Magic Move re-driven as a paused GSAP timeline.",
+ "description": "One snippet transforms into another — tokens glide between positions, leavers fade out, enterers fade in. Shiki Magic Move re-driven as a paused GSAP timeline.",
"tags": [
"code",
"code-animation",
@@ -1267,7 +1285,7 @@
"name": "code-particle-assemble",
"type": "block",
"title": "Code Particle Assemble",
- "description": "Thousands of GPU points scatter through space and fly to the exact glyph pixels of the code, resolving into readable syntax-highlighted text \u2014 a particle system, not a token tween.",
+ "description": "Thousands of GPU points scatter through space and fly to the exact glyph pixels of the code, resolving into readable syntax-highlighted text — a particle system, not a token tween.",
"tags": [
"code",
"code-animation",
@@ -1283,7 +1301,7 @@
"name": "code-scroll",
"type": "block",
"title": "Code Scroll To Line",
- "description": "The camera scrolls a long file to bring a target line to center and spotlights it \u2014 for walking through real modules.",
+ "description": "The camera scrolls a long file to bring a target line to center and spotlights it — for walking through real modules.",
"tags": [
"code",
"code-animation",
@@ -1389,7 +1407,7 @@
"name": "code-typing",
"type": "block",
"title": "Code Typing",
- "description": "Token-streamed typing reveal with a caret that tracks the frontier \u2014 deterministic, no CSS animation.",
+ "description": "Token-streamed typing reveal with a caret that tracks the frontier — deterministic, no CSS animation.",
"tags": [
"code",
"code-animation",
@@ -1495,13 +1513,14 @@
"name": "count-up",
"type": "component",
"title": "Count Up",
- "description": "A token-native stat counter that eases between values and lands with a restrained scale pulse.",
+ "description": "A token-native stat counter that eases between values, counting up or down, and lands with a restrained scale pulse.",
"tags": [
"motion-primitive",
"proof",
"stats",
"counter",
"number",
+ "countdown",
"deterministic"
],
"href": "/catalog/components/count-up",
@@ -1568,22 +1587,133 @@
"href": "/catalog/blocks/cuboid-carousel",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/cuboid-carousel.png"
},
+ {
+ "name": "cursor-annotate",
+ "type": "component",
+ "title": "Annotate Cursor",
+ "description": "A marker pen glides onto the frame and hand-draws a loose loop, an underline, or an arrow around a region, the ink laid exactly under its nib, then lifts and leaves.",
+ "tags": [
+ "cursor",
+ "motion-primitive",
+ "pen",
+ "annotation",
+ "draw-on",
+ "highlight"
+ ],
+ "href": "/catalog/components/cursor-annotate",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/cursor-annotate.png"
+ },
+ {
+ "name": "cursor-context-menu",
+ "type": "component",
+ "title": "Context Menu Cursor",
+ "description": "A cursor right-clicks a file, a context menu blooms from its tip, the hover highlight tracks the item under it, and the chosen action plays out: duplicate, rename, move to trash, or a confirmation toast.",
+ "tags": [
+ "cursor",
+ "motion-primitive",
+ "menu",
+ "right-click",
+ "desktop",
+ "files"
+ ],
+ "href": "/catalog/components/cursor-context-menu",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/cursor-context-menu.png"
+ },
+ {
+ "name": "cursor-drag-drop",
+ "type": "component",
+ "title": "Drag and Drop Cursor",
+ "description": "A cursor grabs a task card, lifts and tilts it into its motion, carries it in lockstep to an empty column, drops it with a small settle, and the list closes the gap behind it.",
+ "tags": [
+ "cursor",
+ "motion-primitive",
+ "drag",
+ "drop",
+ "kanban",
+ "product-demo"
+ ],
+ "href": "/catalog/components/cursor-drag-drop",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/cursor-drag-drop.png"
+ },
{
"name": "cursor-glyph-trail",
"type": "component",
"title": "Cursor Glyph Trail",
- "description": "An actor travels an authored path depositing small dithered glyphs at its past positions, each popping in and decaying in place, stamp rate scaling with the actor's velocity.",
+ "description": "A tutorial cursor path: on a settings screen the arrow clicks through three steps, leaving a dotted trail spaced evenly by distance and a numbered marker at each click; each step's trail fades as the next move begins.",
"tags": [
+ "cursor",
"motion-primitive",
"demonstrate",
"trail",
- "cursor",
- "glyphs",
+ "tutorial",
+ "steps",
"deterministic"
],
"href": "/catalog/components/cursor-glyph-trail",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/cursor-glyph-trail.png"
},
+ {
+ "name": "cursor-marquee-select",
+ "type": "component",
+ "title": "Marquee Select Cursor",
+ "description": "A cursor drags a selection rectangle across a photo grid; each tile rings and pops a check the frame the rectangle touches it, while a pill counts the selection up.",
+ "tags": [
+ "cursor",
+ "motion-primitive",
+ "select",
+ "marquee",
+ "grid",
+ "product-demo"
+ ],
+ "href": "/catalog/components/cursor-marquee-select",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/cursor-marquee-select.png"
+ },
+ {
+ "name": "cursor-text-select",
+ "type": "component",
+ "title": "Text Select Cursor",
+ "description": "An arrow turns into an I-beam over a document, drags a selection across a phrase character by character, raises a format toolbar, turns back into an arrow and clicks Bold.",
+ "tags": [
+ "cursor",
+ "motion-primitive",
+ "text",
+ "selection",
+ "editor",
+ "toolbar"
+ ],
+ "href": "/catalog/components/cursor-text-select",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/cursor-text-select.png"
+ },
+ {
+ "name": "cursor-zoom-follow",
+ "type": "component",
+ "title": "Zoom Follow Cursor",
+ "description": "Screen-recording auto-zoom: the camera pushes in toward each upcoming click, trails the cursor on a smooth spring, marks every click with a press and a ring, then eases back out to the full screen as the cursor leaves.",
+ "tags": [
+ "cursor",
+ "camera",
+ "zoom",
+ "screen-recording",
+ "click",
+ "product-demo"
+ ],
+ "href": "/catalog/components/cursor-zoom-follow",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/cursor-zoom-follow.png"
+ },
+ {
+ "name": "curtain-reveal",
+ "type": "component",
+ "title": "Curtain Reveal",
+ "description": "Two pleated stage curtains gather outward from center, the way real velvet bunches at the tieback, revealing the stage underneath. A static pelmet frames the top; a soft spotlight can bloom in as they part.",
+ "tags": [
+ "curtain",
+ "stage reveal",
+ "transition",
+ "motion-primitive"
+ ],
+ "href": "/catalog/components/curtain-reveal",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/curtain-reveal.png"
+ },
{
"name": "cut-the-curve",
"type": "component",
@@ -1600,6 +1730,22 @@
"href": "/catalog/components/cut-the-curve",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/cut-the-curve.png"
},
+ {
+ "name": "dart-cursor",
+ "type": "component",
+ "title": "Dart Cursor",
+ "description": "A bold outlined arrowhead that dives in from camera depth, flies nose-first with motion blur along its path, squashes on two clicks, and whips out of frame.",
+ "tags": [
+ "cursor",
+ "motion-primitive",
+ "pointer",
+ "click",
+ "motion-blur",
+ "depth"
+ ],
+ "href": "/catalog/components/dart-cursor",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/dart-cursor.png"
+ },
{
"name": "data-chart",
"type": "block",
@@ -1732,6 +1878,24 @@
"href": "/catalog/blocks/editorial-flash-overlay",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/editorial-flash-overlay.png"
},
+ {
+ "name": "exploded-stack",
+ "type": "block",
+ "title": "Exploded Stack",
+ "description": "Isometric layer plates explode apart with a label beside each layer, hold, then collapse back into one stack. Built for architecture and system diagrams.",
+ "tags": [
+ "3d-object",
+ "three-js",
+ "webgl",
+ "isometric",
+ "exploded-view",
+ "layers",
+ "diagram",
+ "architecture"
+ ],
+ "href": "/catalog/blocks/exploded-stack",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/exploded-stack.png"
+ },
{
"name": "extended-keyframe",
"type": "component",
@@ -1751,6 +1915,23 @@
"href": "/catalog/components/extended-keyframe",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/extended-keyframe.png"
},
+ {
+ "name": "extruded-logo",
+ "type": "block",
+ "title": "Extruded Logo",
+ "description": "Beveled 3D letters flip up one by one, the word swings so light runs across the bevels, then settles for a readable hold. Chrome, gold or matte.",
+ "tags": [
+ "3d-object",
+ "three-js",
+ "webgl",
+ "logo",
+ "text",
+ "extruded",
+ "title-card"
+ ],
+ "href": "/catalog/blocks/extruded-logo",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/extruded-logo.png"
+ },
{
"name": "facet-morph",
"type": "component",
@@ -1776,6 +1957,7 @@
"motion-primitive",
"transition",
"fade",
+ "crossfade",
"scene"
],
"href": "/catalog/components/fade-through",
@@ -1931,6 +2113,23 @@
"href": "/catalog/components/gesture-tap",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/gesture-tap.png"
},
+ {
+ "name": "glass-hero",
+ "type": "block",
+ "title": "Glass Hero",
+ "description": "A solid glass object rises in front of a giant headline and keeps turning, so the type bends and splits into colour through it.",
+ "tags": [
+ "3d-object",
+ "three-js",
+ "webgl",
+ "glass",
+ "refraction",
+ "hero",
+ "title-card"
+ ],
+ "href": "/catalog/blocks/glass-hero",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/glass-hero.png"
+ },
{
"name": "glass-shard-title",
"type": "block",
@@ -2013,7 +2212,7 @@
"name": "grain-overlay",
"type": "component",
"title": "Grain Overlay",
- "description": "Animated film grain texture overlay using CSS keyframes \u2014 adds warmth and analog character to any composition",
+ "description": "Animated film grain texture overlay using CSS keyframes — adds warmth and analog character to any composition",
"tags": [
"texture",
"grain",
@@ -2056,7 +2255,7 @@
"name": "grid-pixelate-wipe",
"type": "component",
"title": "Grid Pixelate Wipe",
- "description": "Transition effect where the screen dissolves into a grid of squares that fade out with staggered timing \u2014 use between scenes",
+ "description": "Transition effect where the screen dissolves into a grid of squares that fade out with staggered timing — use between scenes",
"tags": [
"transition",
"wipe",
@@ -2144,7 +2343,7 @@
"name": "hw-boil",
"type": "component",
"title": "Hand-Drawn Boil",
- "description": "Hand-drawn jitter that re-poses every N frames, as seek-safe helpers: pose derives from quantized timeline time through a seeded hash; includes the shared onUpdate dispatcher, a wobbled-ellipse path generator, the boil pose control (off/calm/lively over the family-locked frameDrop), a curvature-adaptive pen-velocity ease, and the completed stroke matrix (plain/soft/sharp/spray \u2014 spray is index-seeded deterministic dots, no turbulence) with texture-safe draw-on",
+ "description": "Hand-drawn jitter that re-poses every N frames, as seek-safe helpers: pose derives from quantized timeline time through a seeded hash; includes the shared onUpdate dispatcher, a wobbled-ellipse path generator, the boil pose control (off/calm/lively over the family-locked frameDrop), a curvature-adaptive pen-velocity ease, and the completed stroke matrix (plain/soft/sharp/spray — spray is index-seeded deterministic dots, no turbulence) with texture-safe draw-on",
"tags": [
"handwritten",
"effect",
@@ -2157,7 +2356,7 @@
"name": "hw-box-label",
"type": "component",
"title": "Hand-Drawn Box Label",
- "description": "Wobbled rounded rectangle draws on \u2014 across the authored stroke matrix (plain/soft/sharp/spray) \u2014 or drops in and lands with a volume-true contact squash and bouncy spring recovery, with a handwritten label above or centered; boils",
+ "description": "Wobbled rounded rectangle draws on — across the authored stroke matrix (plain/soft/sharp/spray) — or drops in and lands with a volume-true contact squash and bouncy spring recovery, with a handwritten label above or centered; boils",
"tags": [
"handwritten",
"annotation",
@@ -2634,7 +2833,7 @@
{
"name": "lower-third-bild",
"type": "block",
- "title": "Lower Third \u2014 BILD Style",
+ "title": "Lower Third — BILD Style",
"description": "News-style lower third with tight-fit text boxes: white headline bar with red drop-shadow, red sub-line with white drop-shadow.",
"tags": [
"broadcast",
@@ -2648,7 +2847,7 @@
{
"name": "lt-accent-underline",
"type": "block",
- "title": "Lower Third \u2014 Accent Underline",
+ "title": "Lower Third — Accent Underline",
"description": "Cardless lower third for footage overlay: name rises, an accent rule draws left-to-right, role fades in; text-shadowed for legibility",
"tags": [
"lower-third",
@@ -2663,7 +2862,7 @@
{
"name": "lt-bold-block",
"type": "block",
- "title": "Lower Third \u2014 Bold Block",
+ "title": "Lower Third — Bold Block",
"description": "High-energy podcast lower third: solid dark block wipes in, uppercase name slams up, accent tag pops",
"tags": [
"lower-third",
@@ -2678,7 +2877,7 @@
{
"name": "lt-clean-bar",
"type": "block",
- "title": "Lower Third \u2014 Clean Bar",
+ "title": "Lower Third — Clean Bar",
"description": "Minimal white-card lower third for podcasts/interviews: accent tab, name + role, clip-wipe entrance",
"tags": [
"lower-third",
@@ -2692,7 +2891,7 @@
{
"name": "lt-color-block",
"type": "block",
- "title": "Lower Third \u2014 Color Block",
+ "title": "Lower Third — Color Block",
"description": "High-energy lower third: bold accent-color block slides in with overshoot, condensed name + mono role",
"tags": [
"lower-third",
@@ -2707,7 +2906,7 @@
{
"name": "lt-dark-card",
"type": "block",
- "title": "Lower Third \u2014 Dark Card",
+ "title": "Lower Third — Dark Card",
"description": "Charcoal card lower third for bright footage: name, drawn accent underline, role; slide-up entrance",
"tags": [
"lower-third",
@@ -2722,7 +2921,7 @@
{
"name": "lt-kicker-name",
"type": "block",
- "title": "Lower Third \u2014 Kicker Name",
+ "title": "Lower Third — Kicker Name",
"description": "Cardless lower third with an accent eyebrow/kicker tag, heavy name, and a drawn baseline; for footage",
"tags": [
"lower-third",
@@ -2737,7 +2936,7 @@
{
"name": "lt-mask-reveal",
"type": "block",
- "title": "Lower Third \u2014 Mask Reveal",
+ "title": "Lower Third — Mask Reveal",
"description": "Cardless lower third: an accent sweep crosses and clip-path-reveals a heavy name, role fades up; for footage",
"tags": [
"lower-third",
@@ -2766,7 +2965,7 @@
{
"name": "lt-side-rule",
"type": "block",
- "title": "Lower Third \u2014 Side Rule",
+ "title": "Lower Third — Side Rule",
"description": "Cardless lower third with a vertical accent bar; condensed display name + mono role, text-shadowed for footage",
"tags": [
"lower-third",
@@ -2781,7 +2980,7 @@
{
"name": "lt-soft-pill",
"type": "block",
- "title": "Lower Third \u2014 Soft Pill",
+ "title": "Lower Third — Soft Pill",
"description": "Rounded white pill lower third for podcasts/interviews: status dot, name + role, scale-pop entrance",
"tags": [
"lower-third",
@@ -2796,7 +2995,7 @@
{
"name": "lt-stack-bars",
"type": "block",
- "title": "Lower Third \u2014 Stack Bars",
+ "title": "Lower Third — Stack Bars",
"description": "Two stacked bars: a dark name bar wipes from the left, an accent role bar wipes from the right",
"tags": [
"lower-third",
@@ -2836,6 +3035,22 @@
"href": "/catalog/blocks/macos-tahoe-liquid-glass",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/macos-tahoe-liquid-glass.png"
},
+ {
+ "name": "magnetic-cursor",
+ "type": "component",
+ "title": "Magnetic Cursor",
+ "description": "A soft dot pointer glides across an editor toolbar, is pulled into each button and morphs into its rounded hover plate while the icon leans toward it, presses one, and leaves as a dot.",
+ "tags": [
+ "cursor",
+ "motion-primitive",
+ "pointer",
+ "hover",
+ "morph",
+ "toolbar"
+ ],
+ "href": "/catalog/components/magnetic-cursor",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/magnetic-cursor.png"
+ },
{
"name": "marker-checklist-card",
"type": "component",
@@ -2969,7 +3184,7 @@
"name": "mk-callout-highlight",
"type": "block",
"title": "Word-Sweep Highlight",
- "description": "A sentence whose word-by-word emphasis is driven by a single scalar \u2014 tween it to sync the highlight with a voiceover",
+ "description": "A sentence whose word-by-word emphasis is driven by a single scalar — tween it to sync the highlight with a voiceover",
"tags": [
"typography",
"karaoke",
@@ -2983,7 +3198,7 @@
"name": "mk-clone-wall-transition",
"type": "block",
"title": "Text Clone Wall Transition",
- "description": "Overlay transition: a tiled word wall covers the frame, inverts via difference blending, and clears \u2014 hard-cut the content beneath while covered",
+ "description": "Overlay transition: a tiled word wall covers the frame, inverts via difference blending, and clears — hard-cut the content beneath while covered",
"tags": [
"transition",
"typography",
@@ -2996,7 +3211,7 @@
"name": "mk-emphasis-type",
"type": "component",
"title": "Background Emphasis Type",
- "description": "Oversized low-contrast background word drifting slowly behind the subject \u2014 typography as texture",
+ "description": "Oversized low-contrast background word drifting slowly behind the subject — typography as texture",
"tags": [
"typography",
"text-treatment",
@@ -3111,7 +3326,7 @@
"name": "morph-text",
"type": "component",
"title": "Morph Text",
- "description": "Gooey text morph \u2014 cycles through an editable word list using SVG threshold + GSAP-driven blur for a fluid, satisfying transition effect",
+ "description": "Gooey text morph — cycles through an editable word list using SVG threshold + GSAP-driven blur for a fluid, satisfying transition effect",
"tags": [
"text",
"text-effect",
@@ -3127,7 +3342,7 @@
"name": "motion-blur",
"type": "component",
"title": "Motion Blur",
- "description": "After Effects-style motion blur \u2014 integrates each element over a shutter window (shutter angle, phase, samples per frame) by sampling the GSAP timeline at sub-frame times and averaging equal-weight additive copies of the element along its real trajectory, so translation, scale, rotation, 3D rotation and skew all drive the smear",
+ "description": "After Effects-style motion blur — integrates each element over a shutter window (shutter angle, phase, samples per frame) by sampling the GSAP timeline at sub-frame times and averaging equal-weight additive copies of the element along its real trajectory, so translation, scale, rotation, 3D rotation and skew all drive the smear",
"tags": [
"effect",
"motion-blur",
@@ -3450,11 +3665,11 @@
"name": "oversized-cursor",
"type": "component",
"title": "Oversized Cursor",
- "description": "A deliberately oversized macOS-style pointer that enters off-screen, travels to a target, clicks to ignite a visible response, then exits",
+ "description": "The look-here pointer for a video: the macOS arrow at 3.5x its normal size lands its tip on one control, clicks it on, settles just below it so the result stays in view, then exits off-screen",
"tags": [
+ "cursor",
"motion-primitive",
"actor",
- "cursor",
"pointer",
"interaction"
],
@@ -3522,6 +3737,22 @@
"href": "/catalog/components/panel-reveal",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/panel-reveal.png"
},
+ {
+ "name": "paper-collage-reveal",
+ "type": "component",
+ "title": "Paper Collage Reveal",
+ "description": "A scrapbook patchwork of torn paper scraps, each with its own texture and tilt, flutters away in a staggered scatter to reveal the content underneath.",
+ "tags": [
+ "collage",
+ "scrapbook",
+ "torn paper",
+ "reveal",
+ "transition",
+ "motion-primitive"
+ ],
+ "href": "/catalog/components/paper-collage-reveal",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/paper-collage-reveal.png"
+ },
{
"name": "parallax-device-dive",
"type": "component",
@@ -3542,7 +3773,7 @@
"name": "parallax-unzoom",
"type": "component",
"title": "Parallax Unzoom",
- "description": "Reveal transition \u2014 focus card scales down from full frame as siblings parallax in to form a grid (reverse of parallax-zoom)",
+ "description": "Reveal transition — focus card scales down from full frame as siblings parallax in to form a grid (reverse of parallax-zoom)",
"tags": [
"transition",
"reveal",
@@ -3558,7 +3789,7 @@
"name": "parallax-zoom",
"type": "component",
"title": "Parallax Zoom",
- "description": "Center card scales up to fill the frame while siblings parallax outward \u2014 inspired by the eBay Playbook hero transition",
+ "description": "Center card scales up to fill the frame while siblings parallax outward — inspired by the eBay Playbook hero transition",
"tags": [
"transition",
"zoom",
@@ -3660,11 +3891,11 @@
"name": "press-ripple",
"type": "component",
"title": "Press Ripple",
- "description": "A cursor decel-arrives from off-stage, lands slightly off-center on a caller-positioned target, compresses with it in lockstep, releases with ink ripple rings, then exits off-stage while the pressed state holds.",
+ "description": "A cursor decel-arrives from off-stage, lands slightly off-center on a caller-positioned target, compresses with it in lockstep, releases with two small click rings while the label swaps to a check, then exits off-stage while the confirmed state holds.",
"tags": [
+ "cursor",
"motion-primitive",
"product-demo",
- "cursor",
"press",
"ripple",
"payoff"
@@ -3672,6 +3903,23 @@
"href": "/catalog/components/press-ripple",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/press-ripple.png"
},
+ {
+ "name": "product-turntable",
+ "type": "block",
+ "title": "Product Turntable",
+ "description": "A product turns a full revolution on a studio plinth in a seamless loop. Drop in a GLB or glTF model, or keep the built-in drink can with your own label.",
+ "tags": [
+ "3d-object",
+ "three-js",
+ "webgl",
+ "product",
+ "turntable",
+ "glb",
+ "loop"
+ ],
+ "href": "/catalog/blocks/product-turntable",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/product-turntable.png"
+ },
{
"name": "pull-back-reveal",
"type": "component",
@@ -4009,7 +4257,7 @@
"name": "shimmer-sweep",
"type": "component",
"title": "Shimmer Sweep",
- "description": "Animated light sweep across text or elements using a CSS gradient mask \u2014 ideal for AI accents and premium reveals",
+ "description": "Animated light sweep across text or elements using a CSS gradient mask — ideal for AI accents and premium reveals",
"tags": [
"text",
"shimmer",
@@ -4023,7 +4271,7 @@
"name": "shutter-slam",
"type": "component",
"title": "Shutter Slam",
- "description": "One word thrown through six single-property beats under integrated shutter blur \u2014 two translate slams, a scale punch, then a full turn about each axis \u2014 on the measured easing of the After Effects export the shutter model was fitted to",
+ "description": "One word thrown through six single-property beats under integrated shutter blur — two translate slams, a scale punch, then a full turn about each axis — on the measured easing of the After Effects export the shutter model was fitted to",
"tags": [
"effect",
"motion-blur",
@@ -4048,21 +4296,6 @@
"href": "/catalog/components/signup-flow",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/signup-flow.png"
},
- {
- "name": "simulated-cursor",
- "type": "component",
- "title": "Simulated Cursor",
- "description": "A lightweight cursor pointer and click pulse for product walkthroughs and agent UI demos",
- "tags": [
- "video-primitive",
- "motion-primitive",
- "cursor",
- "ui",
- "walkthrough"
- ],
- "href": "/catalog/components/simulated-cursor",
- "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/simulated-cursor.png"
- },
{
"name": "skeleton-reveal",
"type": "component",
@@ -4122,6 +4355,25 @@
"href": "/catalog/components/slot-machine-roll",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/slot-machine-roll.png"
},
+ {
+ "name": "snow",
+ "type": "block",
+ "title": "Snow",
+ "description": "Seek-safe falling-snow overlay: sparse or dense flakes drift down with size, speed and opacity correlated per flake for depth, radial-masked so the frame center stays clear",
+ "tags": [
+ "snow",
+ "snowfall",
+ "winter",
+ "weather",
+ "overlay",
+ "ambient",
+ "particles",
+ "media-treatment-overlay",
+ "loopable"
+ ],
+ "href": "/catalog/blocks/snow",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/snow.png"
+ },
{
"name": "social-proof-card",
"type": "component",
@@ -4171,7 +4423,7 @@
"name": "spain-map",
"type": "block",
"title": "Spain Map",
- "description": "Animated Spain choropleth by autonomous community with staggered reveals and gradient legend \u2014 D3 conic conformal projection",
+ "description": "Animated Spain choropleth by autonomous community with staggered reveals and gradient legend — D3 conic conformal projection",
"tags": [
"data",
"map",
@@ -4344,6 +4596,27 @@
"href": "/catalog/components/star-rating-fill",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/star-rating-fill.png"
},
+ {
+ "name": "starfield",
+ "type": "block",
+ "title": "Starfield",
+ "description": "Seek-safe night-sky overlay: sparse or dense stars in three size tiers that twinkle and drift in two parallax layers, radial-masked to keep the frame center clear",
+ "tags": [
+ "starfield",
+ "night-sky",
+ "stars",
+ "twinkle",
+ "sky",
+ "weather",
+ "overlay",
+ "ambient",
+ "particles",
+ "media-treatment-overlay",
+ "loopable"
+ ],
+ "href": "/catalog/blocks/starfield",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/starfield.png"
+ },
{
"name": "state-chip-rail",
"type": "component",
@@ -4831,12 +5104,29 @@
"href": "/catalog/components/top-down-letters",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/top-down-letters.png"
},
+ {
+ "name": "torn-paper-rip",
+ "type": "component",
+ "title": "Torn Paper Rip",
+ "description": "A fibrous paper tear runs across the frame: the torn sheet shows its white paper core along the edge and lifts away on a soft shadow, leaving the next scene standing.",
+ "tags": [
+ "torn paper",
+ "paper rip",
+ "paper tear",
+ "transition",
+ "texture",
+ "motion-primitive"
+ ],
+ "href": "/catalog/components/torn-paper-rip",
+ "preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/components/torn-paper-rip.png"
+ },
{
"name": "touch-indicator",
"type": "component",
"title": "Touch Indicator",
- "description": "A translucent contact-circle gesture actor for mobile UI scenes: it touches the glass, causes a same-frame response, and lifts. Tap or swipe, picked by variable.",
+ "description": "A translucent contact-circle gesture actor for mobile UI scenes: it touches the glass on the frame the host target responds, then lifts. Tap or swipe, picked by variable.",
"tags": [
+ "cursor",
"motion-primitive",
"mobile",
"gesture",
@@ -4931,7 +5221,8 @@
"description": "Showcase of dissolve and fade transitions",
"tags": [
"transition",
- "showcase"
+ "showcase",
+ "crossfade"
],
"href": "/catalog/blocks/transitions-dissolve",
"preview": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/transitions-dissolve.png"
@@ -5138,7 +5429,7 @@
"name": "us-map",
"type": "block",
"title": "US Map",
- "description": "Animated US choropleth map with staggered state reveals, value labels, and gradient legend \u2014 pure inline SVG with GSAP",
+ "description": "Animated US choropleth map with staggered state reveals, value labels, and gradient legend — pure inline SVG with GSAP",
"tags": [
"data",
"map",
@@ -5153,7 +5444,7 @@
"name": "us-map-bubble",
"type": "block",
"title": "US Bubble Map",
- "description": "Animated US bubble map with proportional city markers, value callouts, and connection lines \u2014 composable with us-map",
+ "description": "Animated US bubble map with proportional city markers, value callouts, and connection lines — composable with us-map",
"tags": [
"data",
"map",
@@ -5169,7 +5460,7 @@
"name": "us-map-flow",
"type": "block",
"title": "US Flow Map",
- "description": "Animated connection arcs between US cities over a base map \u2014 composable origin-destination flow visualization",
+ "description": "Animated connection arcs between US cities over a base map — composable origin-destination flow visualization",
"tags": [
"data",
"map",
@@ -5186,7 +5477,7 @@
"name": "us-map-hex",
"type": "block",
"title": "US Hex Grid Map",
- "description": "Animated hexagonal tile grid map \u2014 each state as an equal-weight hex with data fill and abbreviation label",
+ "description": "Animated hexagonal tile grid map — each state as an equal-weight hex with data fill and abbreviation label",
"tags": [
"data",
"map",
@@ -5282,7 +5573,7 @@
"name": "vfx-iphone-device",
"type": "block",
"title": "iPhone & MacBook 3D Showcase",
- "description": "Real GLTF iPhone 15 Pro Max and MacBook Pro models with live HTML-in-Canvas screen content, morphing glass lens, product review camera choreography, and 360\u00b0 turntable.",
+ "description": "Real GLTF iPhone 15 Pro Max and MacBook Pro models with live HTML-in-Canvas screen content, morphing glass lens, product review camera choreography, and 360° turntable.",
"tags": [
"html-in-canvas",
"3d",
@@ -5376,7 +5667,7 @@
"name": "vignette",
"type": "component",
"title": "Vignette",
- "description": "Cinematic radial vignette overlay using a pure-CSS gradient \u2014 darkens the edges to pull focus toward the center",
+ "description": "Cinematic radial vignette overlay using a pure-CSS gradient — darkens the edges to pull focus toward the center",
"tags": [
"vignette",
"overlay",
@@ -5527,7 +5818,7 @@
"name": "world-map",
"type": "block",
"title": "World Map",
- "description": "Animated world choropleth with country-by-country reveal, tooltip labels, and rotating globe inset \u2014 D3 Natural Earth projection",
+ "description": "Animated world choropleth with country-by-country reveal, tooltip labels, and rotating globe inset — D3 Natural Earth projection",
"tags": [
"data",
"map",
diff --git a/docs/public/catalog/assets/47d5160342b99988.woff2 b/docs/public/catalog/assets/47d5160342b99988.woff2
new file mode 100644
index 0000000000000000000000000000000000000000..808d03db172d4bc0776a81a21317cd284ed18e49
GIT binary patch
literal 30628
zcmY(qQ?M{RuQ0m2o@Lv%ZQHhO+qP}nwr$(C?el*Bx!Rdd(xkmfGSi9bCMU`W00{6O
zxD^8+|Bt?K|F@_8|7HK<|1V$$3Sb4q3S-wQ^NFhpD24*?$^1uj!Swl*lm(OnWXVVY
z0yycc5&l6QdoM9S1#tq<2b8b^vH}qUhuVYSgND+A<725^v_Y${vjYG)?+A$&o4?o#
zTdKlkR90Tn5VU)(`~nB(`F`BM`F&39{XW$Fec#~~44rio^q#qVe&GuG11Nlx%Z%z9
zZFIsJ1qh`bkJ?q(h9pDM!X(C?C=wJ0(4
+
+
+