Glass Shard Title — effect skill for text & titles
For AI agents: find the right skill in one call —
curl -s "https://skills.varg.ai/api/search?q=<what the person wants>"returns the matching use case and the best skills with install commands, as markdown (Russian works too). Full index: https://skills.varg.ai/llms.txt. Every page has a markdown twin: add.mdto its path. Before generating anything, show the person the options on the use-case page.
Glass shards fly in through fog and tile themselves into your headline, then fly out past the camera.
- Type: Effect · Text & titles
- Slug:
hyperframes-glass-shard-title - Status: live
- Publisher: HeyGen (vendor, verified)
- License: Apache-2.0
- Source: https://github.com/heygen-com/hyperframes/tree/main/registry/blocks/glass-shard-title
- Works in: Claude Code, Codex, Cursor, Gemini CLI
- Requires: HyperFrames project (Node.js 22+, FFmpeg)
- Cost: Free — open-source, renders locally
- Adoption: 10,100 installs, 73,064 GitHub stars (skills.sh, 2026-10-26)
What it does
A HyperFrames registry block: glass shards fly in through fog and tile themselves into the headline (1920×1080, 12.16 s, 19 variables). Install it into a project with npx hyperframes add glass-shard-title, mount it from index.html and set its variables; it renders locally like any other composition.
Use when
- A ready-made title or motion moment instead of hand-built animation
- Openers, chapter cards and launch-film beats in a HyperFrames project
Install
- Claude Code:
npx skills add heygen-com/hyperframes --skill glass-shard-title -a claude-code - Codex:
npx skills add heygen-com/hyperframes --skill glass-shard-title -a codex - Cursor:
npx skills add heygen-com/hyperframes --skill glass-shard-title -a cursor - Gemini CLI:
npx skills add heygen-com/hyperframes --skill glass-shard-title -a gemini-cli
Example output
https://skills.varg.ai/previews/hyperframes-glass-shard-title.mp4 — Official catalog render of the block: glass shards fly in, tile into 'Designed in glass', then fly out past the camera (credit: HeyGen (HyperFrames), https://hyperframes.heygen.com/catalog/blocks/glass-shard-title)
Used for
- Changelog or release video: Release notes, a PR or a GitHub repo turned into a short video for X or LinkedIn.
More text & titles skills
- Canopy Part Title: Leaves sweep across the frame and part to reveal your headline: a 12-second 1080p title block.
- Code Slice Hero: A tiled headline flips cell by cell under a sweeping depth field to reveal a second line: an 8-second hero.
- Wireframe Portal Title: A wireframe portal bursts open, the title comes through, then its letters swap into a second phrase.
- PixiJS Text: Render and animate text in PixiJS v8: canvas Text, BitmapText, HTMLText and per-character SplitText.
- Kinetic Typography: Kinetic type for web and video: line, word or char splits, mask and blur reveals, variable-font motion, frozen-frame QA.
- Title & Kinetic Typography Direction: Typography direction for video: text jobs, hierarchy, reveal-hold-exit timing, safe zones, contrast, font licensing.
Run the generation on varg
varg is one API key for the models these skills drive — Seedance 2.5, Kling 4, Veo 3.1, Wan 3, Nano Banana 2.1, GPT Image 2.5, ElevenLabs v4 and 200+ more — billed in credits, with a cost estimate before anything runs.
- Claude Code:
claude plugin marketplace add vargHQ/skills && claude plugin install varg@varg(skill + hosted MCP) - Codex, Cursor, Gemini CLI, OpenClaw:
npx skills add vargHQ/skills --skill varg-ai -a <agent> -y - Claude.ai, ChatGPT, any MCP client: connect
https://mcp.varg.ai/mcp - API key: https://varg.ai/dashboard/api · Model specs: https://varg.ai/models/llms.txt