Hover

HoverTemplate

The cursor sweeps the work in behind it; the piece under it lifts while the rest give way, and the last one opens.

Showreel 1 of 15 · 2 to 10 images or videos

0:00 / 0:00

Settings

Template settings

Specific to this template. Every template also accepts the common settings (aspect ratio, background, corner radius).

Setting	Type	Default	What it does
`headingText`	string	`Selected work`	The hero line, set huge behind the sweep and melting away once the cards settle. Empty hides it.
`projectNames`	string	`Matchday, Nightshift, Volt, Keycard, Prestige, Blue Room, Iris, Sevenworlds, Favor, Proba`	Per-media project names, comma-separated in media order (the lockup under the lifted card and the opened card's title).
`projectTypes`	string	`Motion, Art Direction, Branding, Product, Photography, Web Design, Identity, Development, E-commerce, Editorial`	Per-media disciplines, comma-separated in media order (the small line over the name).
`brandText`	string	`Reelfolio`	The line that closes the clip over the opened card. Empty ends on the card.
`textColor`	color	`#f2efe9`	Every letter and the counter.
`scaleIntensity`	number	`1`	Size multiplier on the cards.
`holdDuration`	number	`0.7`	Seconds the cursor rests on each card: the main length control.
`openDuration`	number	`0.65`	Seconds the opened project fills the frame, after its name has landed, before the reel closes.
`showTrail`	boolean	`true`	Whether the cards drop behind the sweeping cursor (true) or pop straight into the row (false, a shorter opening).
`showCursor`	boolean	`true`	Whether the arrow is drawn. Off keeps every reaction and hides its cause.
`imagePosition`	number	`0`	Vertical crop anchor 0–100 (0 = top, 50 = center, 100 = bottom). Only applies when mediaFit is "crop".
`mediaFit`	enum	`crop`	How media meets its frame: "crop" fills a frame shaped by cropAspectRatio; "contain" keeps every photo's own shape.One of: `crop`, `contain`

Request

Example request

A complete, working body for POST /api/v1/render with every default spelled out. Send only the settings you want to change.

POST /api/v1/render — Hover

{
  "id": "HoverTemplate",
  "scale": 1,
  "inputProps": {
    "images": [
      "https://picsum.photos/seed/reelfolio1/1280/800",
      "https://picsum.photos/seed/reelfolio2/1280/800",
      "https://picsum.photos/seed/reelfolio3/1280/800"
    ],
    "settings": {
      "backgroundColor": "#0c0c0c",
      "backgroundType": "color",
      "backgroundLibraryCategory": "mesh",
      "backgroundLibraryImage": "",
      "blurAmount": 0,
      "backgroundOpacity": 1,
      "backgroundGradientStart": "#0c0c0c",
      "backgroundGradientEnd": "#1c1c1c",
      "backgroundGradientNoise": 0,
      "borderRadius": 10,
      "aspectRatio": "16:9",
      "cropAspectRatio": "4:5",
      "headingText": "Selected work",
      "projectNames": "Matchday, Nightshift, Volt, Keycard, Prestige, Blue Room, Iris, Sevenworlds, Favor, Proba",
      "projectTypes": "Motion, Art Direction, Branding, Product, Photography, Web Design, Identity, Development, E-commerce, Editorial",
      "brandText": "Reelfolio",
      "textColor": "#f2efe9",
      "scaleIntensity": 1,
      "holdDuration": 0.7,
      "openDuration": 0.65,
      "showTrail": true,
      "showCursor": true,
      "mediaFit": "crop",
      "imagePosition": 0
    }
  }
}