From bc49262635c33d532a761edd62cb0f4c5dcfec5e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Miguel=20=C3=81ngel?= <miguel.sierra@heygen.com>
Date: Tue, 2 Jun 2026 15:32:16 +0000
Subject: [PATCH 1/5] feat(registry): add Apple Terminal theme code snippet
 blocks
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Adds 12 Apple Terminal built-in profile visualizer blocks to the
Code Snippets catalog section, following the same pattern as the
VS Code theme blocks (commit 5245e190).

Themes: Basic, Clear Dark, Clear Light, Grass, Homebrew, Man Page,
Novel, Ocean, Pro, Red Sands, Silver Aerogel, Solid Colors.

Each block is a self-contained 1920×1080 composition showing a
macOS Terminal.app window in the matching profile colors, with
per-character GSAP typing animation and window.__timelines contract.

Install individually:
  npx hyperframes add code-snippet-apple-terminal-basic

Install all Apple Terminal themes:
  npx hyperframes add apple-terminal

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 .../code-snippet-apple-terminal-basic.mdx     |  67 +++++
 ...code-snippet-apple-terminal-clear-dark.mdx |  67 +++++
 ...ode-snippet-apple-terminal-clear-light.mdx |  67 +++++
 .../code-snippet-apple-terminal-grass.mdx     |  67 +++++
 .../code-snippet-apple-terminal-homebrew.mdx  |  67 +++++
 .../code-snippet-apple-terminal-man-page.mdx  |  67 +++++
 .../code-snippet-apple-terminal-novel.mdx     |  67 +++++
 .../code-snippet-apple-terminal-ocean.mdx     |  67 +++++
 .../code-snippet-apple-terminal-pro.mdx       |  67 +++++
 .../code-snippet-apple-terminal-red-sands.mdx |  67 +++++
 ...-snippet-apple-terminal-silver-aerogel.mdx |  67 +++++
 ...de-snippet-apple-terminal-solid-colors.mdx |  67 +++++
 docs/docs.json                                |  12 +
 .../code-snippet-apple-terminal-basic.html    | 243 +++++++++++++++++
 .../registry-item.json                        |  24 ++
 ...ode-snippet-apple-terminal-clear-dark.html | 240 +++++++++++++++++
 .../registry-item.json                        |  24 ++
 ...de-snippet-apple-terminal-clear-light.html | 240 +++++++++++++++++
 .../registry-item.json                        |  24 ++
 .../code-snippet-apple-terminal-grass.html    | 239 +++++++++++++++++
 .../registry-item.json                        |  24 ++
 .../code-snippet-apple-terminal-homebrew.html | 244 +++++++++++++++++
 .../registry-item.json                        |  24 ++
 .../code-snippet-apple-terminal-man-page.html | 242 +++++++++++++++++
 .../registry-item.json                        |  24 ++
 .../code-snippet-apple-terminal-novel.html    | 238 +++++++++++++++++
 .../registry-item.json                        |  24 ++
 .../code-snippet-apple-terminal-ocean.html    | 243 +++++++++++++++++
 .../registry-item.json                        |  24 ++
 .../code-snippet-apple-terminal-pro.html      | 243 +++++++++++++++++
 .../registry-item.json                        |  24 ++
 ...code-snippet-apple-terminal-red-sands.html | 240 +++++++++++++++++
 .../registry-item.json                        |  24 ++
 ...snippet-apple-terminal-silver-aerogel.html | 246 ++++++++++++++++++
 .../registry-item.json                        |  24 ++
 ...e-snippet-apple-terminal-solid-colors.html | 243 +++++++++++++++++
 .../registry-item.json                        |  24 ++
 37 files changed, 4005 insertions(+)
 create mode 100644 docs/catalog/blocks/code-snippet-apple-terminal-basic.mdx
 create mode 100644 docs/catalog/blocks/code-snippet-apple-terminal-clear-dark.mdx
 create mode 100644 docs/catalog/blocks/code-snippet-apple-terminal-clear-light.mdx
 create mode 100644 docs/catalog/blocks/code-snippet-apple-terminal-grass.mdx
 create mode 100644 docs/catalog/blocks/code-snippet-apple-terminal-homebrew.mdx
 create mode 100644 docs/catalog/blocks/code-snippet-apple-terminal-man-page.mdx
 create mode 100644 docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx
 create mode 100644 docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx
 create mode 100644 docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx
 create mode 100644 docs/catalog/blocks/code-snippet-apple-terminal-red-sands.mdx
 create mode 100644 docs/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mdx
 create mode 100644 docs/catalog/blocks/code-snippet-apple-terminal-solid-colors.mdx
 create mode 100644 registry/blocks/code-snippet-apple-terminal-basic/code-snippet-apple-terminal-basic.html
 create mode 100644 registry/blocks/code-snippet-apple-terminal-basic/registry-item.json
 create mode 100644 registry/blocks/code-snippet-apple-terminal-clear-dark/code-snippet-apple-terminal-clear-dark.html
 create mode 100644 registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
 create mode 100644 registry/blocks/code-snippet-apple-terminal-clear-light/code-snippet-apple-terminal-clear-light.html
 create mode 100644 registry/blocks/code-snippet-apple-terminal-clear-light/registry-item.json
 create mode 100644 registry/blocks/code-snippet-apple-terminal-grass/code-snippet-apple-terminal-grass.html
 create mode 100644 registry/blocks/code-snippet-apple-terminal-grass/registry-item.json
 create mode 100644 registry/blocks/code-snippet-apple-terminal-homebrew/code-snippet-apple-terminal-homebrew.html
 create mode 100644 registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
 create mode 100644 registry/blocks/code-snippet-apple-terminal-man-page/code-snippet-apple-terminal-man-page.html
 create mode 100644 registry/blocks/code-snippet-apple-terminal-man-page/registry-item.json
 create mode 100644 registry/blocks/code-snippet-apple-terminal-novel/code-snippet-apple-terminal-novel.html
 create mode 100644 registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
 create mode 100644 registry/blocks/code-snippet-apple-terminal-ocean/code-snippet-apple-terminal-ocean.html
 create mode 100644 registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
 create mode 100644 registry/blocks/code-snippet-apple-terminal-pro/code-snippet-apple-terminal-pro.html
 create mode 100644 registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
 create mode 100644 registry/blocks/code-snippet-apple-terminal-red-sands/code-snippet-apple-terminal-red-sands.html
 create mode 100644 registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
 create mode 100644 registry/blocks/code-snippet-apple-terminal-silver-aerogel/code-snippet-apple-terminal-silver-aerogel.html
 create mode 100644 registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
 create mode 100644 registry/blocks/code-snippet-apple-terminal-solid-colors/code-snippet-apple-terminal-solid-colors.html
 create mode 100644 registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json

diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-basic.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-basic.mdx
new file mode 100644
index 000000000..0021f80a7
--- /dev/null
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-basic.mdx
@@ -0,0 +1,67 @@
+---
+title: "Apple Terminal Basic"
+description: "Apple Terminal Basic profile with white background and black text, per-character typing animation."
+---
+
+# Apple Terminal Basic
+
+macOS Terminal.app window in the built-in Basic profile — clean white background with black monospace text and a solid black cursor. Per-character typing animation with output reveal.
+
+`code` `developer` `showcase` `terminal` `apple`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-basic.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-basic.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add code-snippet-apple-terminal-basic
+```
+
+</CodeGroup>
+
+Install all Apple Terminal themes at once:
+
+```bash Terminal
+npx hyperframes add apple-terminal
+```
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 12s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `code-snippet-apple-terminal-basic.html` | `compositions/code-snippet-apple-terminal-basic.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div
+  data-composition-id="code-snippet-apple-terminal-basic"
+  data-composition-src="compositions/code-snippet-apple-terminal-basic.html"
+  data-start="0"
+  data-duration="12"
+  data-track-index="1"
+  data-width="1920"
+  data-height="1080"
+></div>
+```
+
+## Features
+
+- Faithful recreation of macOS Terminal.app Basic profile — white background, black text, solid cursor
+- macOS window chrome with traffic light buttons (close, minimize, fullscreen) and centered title bar
+- Per-character GSAP typing animation — command types out character by character
+- Output lines reveal sequentially after command executes
+- Cursor blinks three times at the end then holds steady
+- Self-contained HTML — no external assets, only GSAP CDN
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-clear-dark.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-clear-dark.mdx
new file mode 100644
index 000000000..121cdabde
--- /dev/null
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-clear-dark.mdx
@@ -0,0 +1,67 @@
+---
+title: "Apple Terminal Clear Dark"
+description: "Apple Terminal Clear Dark profile with semi-transparent dark background and white text, per-character typing animation."
+---
+
+# Apple Terminal Clear Dark
+
+macOS Terminal.app window in the built-in Clear Dark profile — translucent black background with white text and a grey cursor. Per-character typing animation with output reveal.
+
+`code` `developer` `showcase` `terminal` `apple`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-dark.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-dark.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add code-snippet-apple-terminal-clear-dark
+```
+
+</CodeGroup>
+
+Install all Apple Terminal themes at once:
+
+```bash Terminal
+npx hyperframes add apple-terminal
+```
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 12s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `code-snippet-apple-terminal-clear-dark.html` | `compositions/code-snippet-apple-terminal-clear-dark.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div
+  data-composition-id="code-snippet-apple-terminal-clear-dark"
+  data-composition-src="compositions/code-snippet-apple-terminal-clear-dark.html"
+  data-start="0"
+  data-duration="12"
+  data-track-index="1"
+  data-width="1920"
+  data-height="1080"
+></div>
+```
+
+## Features
+
+- Faithful recreation of macOS Terminal.app Clear Dark profile — semi-transparent black background with white text
+- macOS window chrome with traffic light buttons and centered title bar
+- Per-character GSAP typing animation — command types out character by character
+- Output lines reveal sequentially after command executes
+- Cursor blinks three times at the end then holds steady
+- Self-contained HTML — no external assets, only GSAP CDN
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-clear-light.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-clear-light.mdx
new file mode 100644
index 000000000..7654fe4e8
--- /dev/null
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-clear-light.mdx
@@ -0,0 +1,67 @@
+---
+title: "Apple Terminal Clear Light"
+description: "Apple Terminal Clear Light profile with semi-transparent white background and black text, per-character typing animation."
+---
+
+# Apple Terminal Clear Light
+
+macOS Terminal.app window in the built-in Clear Light profile — translucent white background with black text and a grey cursor. Per-character typing animation with output reveal.
+
+`code` `developer` `showcase` `terminal` `apple`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-light.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-light.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add code-snippet-apple-terminal-clear-light
+```
+
+</CodeGroup>
+
+Install all Apple Terminal themes at once:
+
+```bash Terminal
+npx hyperframes add apple-terminal
+```
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 12s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `code-snippet-apple-terminal-clear-light.html` | `compositions/code-snippet-apple-terminal-clear-light.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div
+  data-composition-id="code-snippet-apple-terminal-clear-light"
+  data-composition-src="compositions/code-snippet-apple-terminal-clear-light.html"
+  data-start="0"
+  data-duration="12"
+  data-track-index="1"
+  data-width="1920"
+  data-height="1080"
+></div>
+```
+
+## Features
+
+- Faithful recreation of macOS Terminal.app Clear Light profile — semi-transparent white background with black text
+- macOS window chrome with traffic light buttons and centered title bar
+- Per-character GSAP typing animation — command types out character by character
+- Output lines reveal sequentially after command executes
+- Cursor blinks three times at the end then holds steady
+- Self-contained HTML — no external assets, only GSAP CDN
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-grass.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-grass.mdx
new file mode 100644
index 000000000..d64bb7e5b
--- /dev/null
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-grass.mdx
@@ -0,0 +1,67 @@
+---
+title: "Apple Terminal Grass"
+description: "Apple Terminal Grass profile with black background and bright green text, per-character typing animation."
+---
+
+# Apple Terminal Grass
+
+macOS Terminal.app window in the built-in Grass profile — pitch-black background with pure green text and a matching cursor. Classic terminal aesthetic with per-character typing animation.
+
+`code` `developer` `showcase` `terminal` `apple`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-grass.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-grass.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add code-snippet-apple-terminal-grass
+```
+
+</CodeGroup>
+
+Install all Apple Terminal themes at once:
+
+```bash Terminal
+npx hyperframes add apple-terminal
+```
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 12s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `code-snippet-apple-terminal-grass.html` | `compositions/code-snippet-apple-terminal-grass.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div
+  data-composition-id="code-snippet-apple-terminal-grass"
+  data-composition-src="compositions/code-snippet-apple-terminal-grass.html"
+  data-start="0"
+  data-duration="12"
+  data-track-index="1"
+  data-width="1920"
+  data-height="1080"
+></div>
+```
+
+## Features
+
+- Faithful recreation of macOS Terminal.app Grass profile — black background with #00C100 green text
+- macOS window chrome with green-accented title bar and traffic light buttons
+- Per-character GSAP typing animation — command types out character by character
+- Output lines reveal sequentially after command executes
+- Cursor blinks three times at the end then holds steady
+- Self-contained HTML — no external assets, only GSAP CDN
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-homebrew.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-homebrew.mdx
new file mode 100644
index 000000000..ce29245d3
--- /dev/null
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-homebrew.mdx
@@ -0,0 +1,67 @@
+---
+title: "Apple Terminal Homebrew"
+description: "Apple Terminal Homebrew profile with black background, bright green text and lime cursor, per-character typing animation."
+---
+
+# Apple Terminal Homebrew
+
+macOS Terminal.app window in the built-in Homebrew profile — black background with vivid green text and a lime `#48F800` cursor. One of the most beloved classic terminal looks.
+
+`code` `developer` `showcase` `terminal` `apple`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-homebrew.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-homebrew.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add code-snippet-apple-terminal-homebrew
+```
+
+</CodeGroup>
+
+Install all Apple Terminal themes at once:
+
+```bash Terminal
+npx hyperframes add apple-terminal
+```
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 12s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `code-snippet-apple-terminal-homebrew.html` | `compositions/code-snippet-apple-terminal-homebrew.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div
+  data-composition-id="code-snippet-apple-terminal-homebrew"
+  data-composition-src="compositions/code-snippet-apple-terminal-homebrew.html"
+  data-start="0"
+  data-duration="12"
+  data-track-index="1"
+  data-width="1920"
+  data-height="1080"
+></div>
+```
+
+## Features
+
+- Faithful recreation of macOS Terminal.app Homebrew profile — black background with #00CF00 text and #48F800 cursor
+- macOS window chrome with traffic light buttons and centered title bar
+- Per-character GSAP typing animation — command types out character by character
+- Output lines reveal sequentially after command executes
+- Cursor blinks three times at the end then holds steady
+- Self-contained HTML — no external assets, only GSAP CDN
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-man-page.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-man-page.mdx
new file mode 100644
index 000000000..11c96f415
--- /dev/null
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-man-page.mdx
@@ -0,0 +1,67 @@
+---
+title: "Apple Terminal Man Page"
+description: "Apple Terminal Man Page profile with pale yellow background and black text, per-character typing animation."
+---
+
+# Apple Terminal Man Page
+
+macOS Terminal.app window in the built-in Man Page profile — pale yellow `#FEF49C` background with black text. Evoking classic Unix manual pages, with per-character typing animation.
+
+`code` `developer` `showcase` `terminal` `apple`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-man-page.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-man-page.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add code-snippet-apple-terminal-man-page
+```
+
+</CodeGroup>
+
+Install all Apple Terminal themes at once:
+
+```bash Terminal
+npx hyperframes add apple-terminal
+```
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 12s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `code-snippet-apple-terminal-man-page.html` | `compositions/code-snippet-apple-terminal-man-page.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div
+  data-composition-id="code-snippet-apple-terminal-man-page"
+  data-composition-src="compositions/code-snippet-apple-terminal-man-page.html"
+  data-start="0"
+  data-duration="12"
+  data-track-index="1"
+  data-width="1920"
+  data-height="1080"
+></div>
+```
+
+## Features
+
+- Faithful recreation of macOS Terminal.app Man Page profile — pale yellow background with black text
+- Shows a realistic man page output structure with sections and indented content
+- macOS window chrome with traffic light buttons and centered title bar
+- Per-character GSAP typing animation — command types out character by character
+- Output lines reveal sequentially after command executes
+- Self-contained HTML — no external assets, only GSAP CDN
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx
new file mode 100644
index 000000000..9f6cd776c
--- /dev/null
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx
@@ -0,0 +1,67 @@
+---
+title: "Apple Terminal Novel"
+description: "Apple Terminal Novel profile with warm parchment background and dark brown text, per-character typing animation."
+---
+
+# Apple Terminal Novel
+
+macOS Terminal.app window in the built-in Novel profile — warm parchment `#DFC18A` background with deep brown text. A distinctive earthy look, with per-character typing animation.
+
+`code` `developer` `showcase` `terminal` `apple`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-novel.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-novel.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add code-snippet-apple-terminal-novel
+```
+
+</CodeGroup>
+
+Install all Apple Terminal themes at once:
+
+```bash Terminal
+npx hyperframes add apple-terminal
+```
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 12s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `code-snippet-apple-terminal-novel.html` | `compositions/code-snippet-apple-terminal-novel.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div
+  data-composition-id="code-snippet-apple-terminal-novel"
+  data-composition-src="compositions/code-snippet-apple-terminal-novel.html"
+  data-start="0"
+  data-duration="12"
+  data-track-index="1"
+  data-width="1920"
+  data-height="1080"
+></div>
+```
+
+## Features
+
+- Faithful recreation of macOS Terminal.app Novel profile — warm parchment background with #3E2900 dark brown text
+- macOS window chrome with traffic light buttons and centered title bar
+- Per-character GSAP typing animation — command types out character by character
+- Output lines reveal sequentially after command executes
+- Cursor blinks three times at the end then holds steady
+- Self-contained HTML — no external assets, only GSAP CDN
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx
new file mode 100644
index 000000000..a46b68c0e
--- /dev/null
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx
@@ -0,0 +1,67 @@
+---
+title: "Apple Terminal Ocean"
+description: "Apple Terminal Ocean profile with deep blue background and white text, per-character typing animation."
+---
+
+# Apple Terminal Ocean
+
+macOS Terminal.app window in the built-in Ocean profile — vivid `#224FBE` blue background with crisp white text. Bold and distinctive, with per-character typing animation.
+
+`code` `developer` `showcase` `terminal` `apple`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-ocean.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-ocean.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add code-snippet-apple-terminal-ocean
+```
+
+</CodeGroup>
+
+Install all Apple Terminal themes at once:
+
+```bash Terminal
+npx hyperframes add apple-terminal
+```
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 12s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `code-snippet-apple-terminal-ocean.html` | `compositions/code-snippet-apple-terminal-ocean.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div
+  data-composition-id="code-snippet-apple-terminal-ocean"
+  data-composition-src="compositions/code-snippet-apple-terminal-ocean.html"
+  data-start="0"
+  data-duration="12"
+  data-track-index="1"
+  data-width="1920"
+  data-height="1080"
+></div>
+```
+
+## Features
+
+- Faithful recreation of macOS Terminal.app Ocean profile — #224FBE blue background with white text
+- macOS window chrome with traffic light buttons and centered title bar
+- Per-character GSAP typing animation — command types out character by character
+- Output lines reveal sequentially after command executes
+- Cursor blinks three times at the end then holds steady
+- Self-contained HTML — no external assets, only GSAP CDN
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx
new file mode 100644
index 000000000..f9d3d5ee6
--- /dev/null
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx
@@ -0,0 +1,67 @@
+---
+title: "Apple Terminal Pro"
+description: "Apple Terminal Pro profile with black background, grey text and lime green cursor, per-character typing animation."
+---
+
+# Apple Terminal Pro
+
+macOS Terminal.app window in the built-in Pro profile — pure black background with grey `#BBBBBB` text and a distinctive `#88FF67` lime cursor. Hacker aesthetic with per-character typing animation.
+
+`code` `developer` `showcase` `terminal` `apple`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-pro.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-pro.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add code-snippet-apple-terminal-pro
+```
+
+</CodeGroup>
+
+Install all Apple Terminal themes at once:
+
+```bash Terminal
+npx hyperframes add apple-terminal
+```
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 12s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `code-snippet-apple-terminal-pro.html` | `compositions/code-snippet-apple-terminal-pro.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div
+  data-composition-id="code-snippet-apple-terminal-pro"
+  data-composition-src="compositions/code-snippet-apple-terminal-pro.html"
+  data-start="0"
+  data-duration="12"
+  data-track-index="1"
+  data-width="1920"
+  data-height="1080"
+></div>
+```
+
+## Features
+
+- Faithful recreation of macOS Terminal.app Pro profile — black background, #BBBBBB grey text, #88FF67 lime cursor
+- macOS window chrome with traffic light buttons and centered title bar
+- Per-character GSAP typing animation — command types out character by character
+- Output lines reveal sequentially after command executes
+- Cursor blinks three times at the end then holds steady
+- Self-contained HTML — no external assets, only GSAP CDN
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-red-sands.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-red-sands.mdx
new file mode 100644
index 000000000..2b97c025f
--- /dev/null
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-red-sands.mdx
@@ -0,0 +1,67 @@
+---
+title: "Apple Terminal Red Sands"
+description: "Apple Terminal Red Sands profile with deep red background and sandy text, per-character typing animation."
+---
+
+# Apple Terminal Red Sands
+
+macOS Terminal.app window in the built-in Red Sands profile — deep crimson `#7B140E` background with warm sandy `#FFE1B9` text. A bold, dramatic look with per-character typing animation.
+
+`code` `developer` `showcase` `terminal` `apple`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-red-sands.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-red-sands.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add code-snippet-apple-terminal-red-sands
+```
+
+</CodeGroup>
+
+Install all Apple Terminal themes at once:
+
+```bash Terminal
+npx hyperframes add apple-terminal
+```
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 12s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `code-snippet-apple-terminal-red-sands.html` | `compositions/code-snippet-apple-terminal-red-sands.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div
+  data-composition-id="code-snippet-apple-terminal-red-sands"
+  data-composition-src="compositions/code-snippet-apple-terminal-red-sands.html"
+  data-start="0"
+  data-duration="12"
+  data-track-index="1"
+  data-width="1920"
+  data-height="1080"
+></div>
+```
+
+## Features
+
+- Faithful recreation of macOS Terminal.app Red Sands profile — #7B140E red background with #FFE1B9 sandy text
+- macOS window chrome with traffic light buttons and centered title bar
+- Per-character GSAP typing animation — command types out character by character
+- Output lines reveal sequentially after command executes
+- Cursor blinks three times at the end then holds steady
+- Self-contained HTML — no external assets, only GSAP CDN
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mdx
new file mode 100644
index 000000000..82bd77750
--- /dev/null
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mdx
@@ -0,0 +1,67 @@
+---
+title: "Apple Terminal Silver Aerogel"
+description: "Apple Terminal Silver Aerogel profile with dark grey background and white text, per-character typing animation."
+---
+
+# Apple Terminal Silver Aerogel
+
+macOS Terminal.app window in the built-in Silver Aerogel profile — dark grey `#3D3D3D` background with clean white text. A professional neutral look with per-character typing animation.
+
+`code` `developer` `showcase` `terminal` `apple`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add code-snippet-apple-terminal-silver-aerogel
+```
+
+</CodeGroup>
+
+Install all Apple Terminal themes at once:
+
+```bash Terminal
+npx hyperframes add apple-terminal
+```
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 12s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `code-snippet-apple-terminal-silver-aerogel.html` | `compositions/code-snippet-apple-terminal-silver-aerogel.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div
+  data-composition-id="code-snippet-apple-terminal-silver-aerogel"
+  data-composition-src="compositions/code-snippet-apple-terminal-silver-aerogel.html"
+  data-start="0"
+  data-duration="12"
+  data-track-index="1"
+  data-width="1920"
+  data-height="1080"
+></div>
+```
+
+## Features
+
+- Faithful recreation of macOS Terminal.app Silver Aerogel profile — #3D3D3D dark grey background with white text
+- macOS window chrome with traffic light buttons and centered title bar
+- Per-character GSAP typing animation — command types out character by character
+- Output lines reveal sequentially after command executes
+- Cursor blinks three times at the end then holds steady
+- Self-contained HTML — no external assets, only GSAP CDN
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-solid-colors.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-solid-colors.mdx
new file mode 100644
index 000000000..48386ba60
--- /dev/null
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-solid-colors.mdx
@@ -0,0 +1,67 @@
+---
+title: "Apple Terminal Solid Colors"
+description: "Apple Terminal Solid Colors profile with deep purple background and white text, per-character typing animation."
+---
+
+# Apple Terminal Solid Colors
+
+macOS Terminal.app window in the built-in Solid Colors profile — vivid deep purple `#4C0099` background with white text. Eye-catching and vibrant, with per-character typing animation.
+
+`code` `developer` `showcase` `terminal` `apple`
+
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-solid-colors.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-solid-colors.png" autoPlay muted loop playsInline />
+
+## Install
+
+<CodeGroup>
+
+```bash Terminal
+npx hyperframes add code-snippet-apple-terminal-solid-colors
+```
+
+</CodeGroup>
+
+Install all Apple Terminal themes at once:
+
+```bash Terminal
+npx hyperframes add apple-terminal
+```
+
+## Details
+
+| Property | Value |
+| --- | --- |
+| Type | Block |
+| Dimensions | 1920×1080 |
+| Duration | 12s |
+
+## Files
+
+| File | Target | Type |
+| --- | --- | --- |
+| `code-snippet-apple-terminal-solid-colors.html` | `compositions/code-snippet-apple-terminal-solid-colors.html` | hyperframes:composition |
+
+## Usage
+
+After installing, add the block to your host composition:
+
+```html
+<div
+  data-composition-id="code-snippet-apple-terminal-solid-colors"
+  data-composition-src="compositions/code-snippet-apple-terminal-solid-colors.html"
+  data-start="0"
+  data-duration="12"
+  data-track-index="1"
+  data-width="1920"
+  data-height="1080"
+></div>
+```
+
+## Features
+
+- Faithful recreation of macOS Terminal.app Solid Colors profile — #4C0099 deep purple background with white text
+- macOS window chrome with traffic light buttons and centered title bar
+- Per-character GSAP typing animation — command types out character by character
+- Output lines reveal sequentially after command executes
+- Cursor blinks three times at the end then holds steady
+- Self-contained HTML — no external assets, only GSAP CDN
diff --git a/docs/docs.json b/docs/docs.json
index e7a095c8a..0449793d6 100644
--- a/docs/docs.json
+++ b/docs/docs.json
@@ -241,6 +241,18 @@
           {
             "group": "Code Snippets",
             "pages": [
+              "catalog/blocks/code-snippet-apple-terminal-basic",
+              "catalog/blocks/code-snippet-apple-terminal-clear-dark",
+              "catalog/blocks/code-snippet-apple-terminal-clear-light",
+              "catalog/blocks/code-snippet-apple-terminal-grass",
+              "catalog/blocks/code-snippet-apple-terminal-homebrew",
+              "catalog/blocks/code-snippet-apple-terminal-man-page",
+              "catalog/blocks/code-snippet-apple-terminal-novel",
+              "catalog/blocks/code-snippet-apple-terminal-ocean",
+              "catalog/blocks/code-snippet-apple-terminal-pro",
+              "catalog/blocks/code-snippet-apple-terminal-red-sands",
+              "catalog/blocks/code-snippet-apple-terminal-silver-aerogel",
+              "catalog/blocks/code-snippet-apple-terminal-solid-colors",
               "catalog/blocks/code-snippet-dark-2026",
               "catalog/blocks/code-snippet-dark-modern",
               "catalog/blocks/code-snippet-dark-plus",
diff --git a/registry/blocks/code-snippet-apple-terminal-basic/code-snippet-apple-terminal-basic.html b/registry/blocks/code-snippet-apple-terminal-basic/code-snippet-apple-terminal-basic.html
new file mode 100644
index 000000000..691ddbc1e
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-basic/code-snippet-apple-terminal-basic.html
@@ -0,0 +1,243 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=1920, height=1080" />
+    <title>Apple Terminal Basic</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        background: #ececec;
+        font-family: "SF Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      #scene {
+        width: 1920px;
+        height: 1080px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: linear-gradient(135deg, #e8e8e8 0%, #d8d8d8 100%);
+      }
+
+      .terminal-window {
+        width: 1400px;
+        height: 700px;
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow:
+          0 30px 80px rgba(0, 0, 0, 0.25),
+          0 10px 30px rgba(0, 0, 0, 0.15);
+        display: flex;
+        flex-direction: column;
+      }
+
+      .titlebar {
+        height: 38px;
+        background: #ececec;
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        gap: 0;
+        flex-shrink: 0;
+        border-bottom: 1px solid #d0d0d0;
+        position: relative;
+      }
+
+      .traffic-lights {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .traffic-lights span {
+        width: 13px;
+        height: 13px;
+        border-radius: 50%;
+        display: inline-block;
+      }
+
+      .traffic-lights .close {
+        background: #ff5f57;
+        border: 1px solid #e0443e;
+      }
+
+      .traffic-lights .minimize {
+        background: #ffbd2e;
+        border: 1px solid #dfa123;
+      }
+
+      .traffic-lights .fullscreen {
+        background: #28c840;
+        border: 1px solid #1aab29;
+      }
+
+      .window-title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-size: 13px;
+        color: #333333;
+        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
+        font-weight: 500;
+        letter-spacing: -0.1px;
+      }
+
+      .terminal-canvas {
+        flex: 1;
+        background: #ffffff;
+        padding: 18px 20px;
+        overflow: hidden;
+        font-size: 14px;
+        line-height: 1.6;
+        color: #000000;
+      }
+
+      .output-lines {
+        margin-bottom: 4px;
+      }
+
+      .output-line {
+        display: block;
+        white-space: pre;
+        opacity: 0;
+        color: #000000;
+      }
+
+      .output-line.bold {
+        font-weight: bold;
+        color: #000000;
+      }
+
+      .input-line {
+        display: flex;
+        align-items: center;
+        white-space: pre;
+      }
+
+      .prompt {
+        color: #000000;
+        font-weight: bold;
+        user-select: none;
+      }
+
+      .typed-command {
+        color: #000000;
+      }
+
+      .cursor-block {
+        display: inline-block;
+        width: 9px;
+        height: 16px;
+        background: #000000;
+        vertical-align: text-bottom;
+        margin-left: 1px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="scene"
+      data-composition-id="code-snippet-apple-terminal-basic"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div class="terminal-window">
+        <div class="titlebar">
+          <div class="traffic-lights">
+            <span class="close"></span>
+            <span class="minimize"></span>
+            <span class="fullscreen"></span>
+          </div>
+          <span class="window-title">bash — 80×24</span>
+        </div>
+        <div class="terminal-canvas">
+          <div class="output-lines">
+            <span class="output-line">Last login: Mon Jun  2 09:14:22 on ttys001</span>
+            <span class="output-line">total 48</span>
+            <span class="output-line bold">drwxr-xr-x   8 user  staff   256 Jun  2 09:10 .</span>
+            <span class="output-line">drwxr-xr-x  42 user  staff  1344 Jun  1 18:22 ..</span>
+            <span class="output-line">-rw-r--r--   1 user  staff   872 May 30 14:05 README.md</span>
+            <span class="output-line bold">drwxr-xr-x   5 user  staff   160 Jun  2 09:10 dist</span>
+            <span class="output-line bold">drwxr-xr-x  12 user  staff   384 Jun  2 09:10 node_modules</span>
+            <span class="output-line">-rw-r--r--   1 user  staff  1204 Jun  2 09:08 package.json</span>
+            <span class="output-line bold">drwxr-xr-x   6 user  staff   192 Jun  2 09:10 src</span>
+            <span class="output-line">-rw-r--r--   1 user  staff   348 May 29 11:42 tsconfig.json</span>
+          </div>
+          <div class="input-line">
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+
+      const command = "ls -la";
+      const typedEl = document.querySelector(".typed-command");
+      const cursorEl = document.querySelector(".cursor-block");
+      const outputLines = document.querySelectorAll(".output-line");
+
+      const tl = gsap.timeline({ paused: true });
+
+      // Phase 1 (0–0.5s): hold on empty prompt
+      tl.set(typedEl, { text: "" }, 0);
+
+      // Phase 2 (0.5–2s): type command char by char
+      const charDuration = 1.5 / command.length;
+      command.split("").forEach((char, i) => {
+        tl.add(() => {
+          typedEl.textContent = command.slice(0, i + 1);
+        }, 0.5 + i * charDuration);
+      });
+
+      // Phase 3 (2.2s): hide cursor, show first output line (login message)
+      tl.set(cursorEl, { opacity: 0 }, 2.2);
+      tl.set(outputLines[0], { opacity: 1 }, 2.3);
+
+      // Phase 4 (2.5s): clear command, show ls output line by line
+      tl.add(() => {
+        typedEl.textContent = "";
+      }, 2.5);
+
+      outputLines.forEach((line, i) => {
+        if (i === 0) return; // already shown
+        tl.set(line, { opacity: 1 }, 2.8 + i * 0.08);
+      });
+
+      // Phase 5 (4s): new prompt with blinking cursor
+      tl.add(() => {
+        const inputLine = document.querySelector(".input-line");
+        const newPrompt = document.createElement("div");
+        newPrompt.className = "input-line";
+        newPrompt.innerHTML =
+          '<span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block" id="final-cursor"></span>';
+        inputLine.style.display = "none";
+        inputLine.parentNode.appendChild(newPrompt);
+      }, 4.0);
+
+      // Phase 6 (4.2–10s): blink cursor 3 times then stop
+      const blinkTimes = [4.2, 4.6, 5.0, 5.4, 5.8, 6.2];
+      blinkTimes.forEach((t, i) => {
+        tl.add(() => {
+          const fc = document.getElementById("final-cursor");
+          if (fc) fc.style.opacity = i % 2 === 0 ? "0" : "1";
+        }, t);
+      });
+      tl.add(() => {
+        const fc = document.getElementById("final-cursor");
+        if (fc) fc.style.opacity = "1";
+      }, 6.6);
+
+      window.__timelines["code-snippet-apple-terminal-basic"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/code-snippet-apple-terminal-basic/registry-item.json b/registry/blocks/code-snippet-apple-terminal-basic/registry-item.json
new file mode 100644
index 000000000..ca2cce162
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-basic/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "code-snippet-apple-terminal-basic",
+  "type": "hyperframes:block",
+  "title": "Code Snippet - Apple Terminal Basic",
+  "description": "Apple Terminal Basic profile: white background, black text, per-character typing animation of a shell session.",
+  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 12,
+  "files": [
+    {
+      "path": "code-snippet-apple-terminal-basic.html",
+      "target": "compositions/code-snippet-apple-terminal-basic.html",
+      "type": "hyperframes:composition"
+    }
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-basic.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-basic.png"
+  }
+}
diff --git a/registry/blocks/code-snippet-apple-terminal-clear-dark/code-snippet-apple-terminal-clear-dark.html b/registry/blocks/code-snippet-apple-terminal-clear-dark/code-snippet-apple-terminal-clear-dark.html
new file mode 100644
index 000000000..6aed8f27b
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-clear-dark/code-snippet-apple-terminal-clear-dark.html
@@ -0,0 +1,240 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=1920, height=1080" />
+    <title>Apple Terminal Clear Dark</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        background: #1a1a1a;
+        font-family: "SF Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      #scene {
+        width: 1920px;
+        height: 1080px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: linear-gradient(135deg, #1a1a1a 0%, #111111 100%);
+      }
+
+      .terminal-window {
+        width: 1400px;
+        height: 700px;
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow:
+          0 30px 80px rgba(0, 0, 0, 0.7),
+          0 10px 30px rgba(0, 0, 0, 0.5);
+        display: flex;
+        flex-direction: column;
+      }
+
+      .titlebar {
+        height: 38px;
+        background: rgba(0, 0, 0, 0.4);
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        flex-shrink: 0;
+        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
+        position: relative;
+      }
+
+      .traffic-lights {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .traffic-lights span {
+        width: 13px;
+        height: 13px;
+        border-radius: 50%;
+        display: inline-block;
+      }
+
+      .traffic-lights .close {
+        background: #ff5f57;
+        border: 1px solid #e0443e;
+      }
+
+      .traffic-lights .minimize {
+        background: #ffbd2e;
+        border: 1px solid #dfa123;
+      }
+
+      .traffic-lights .fullscreen {
+        background: #28c840;
+        border: 1px solid #1aab29;
+      }
+
+      .window-title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-size: 13px;
+        color: #ffffff;
+        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
+        font-weight: 500;
+        letter-spacing: -0.1px;
+      }
+
+      .terminal-canvas {
+        flex: 1;
+        background: rgba(0, 0, 0, 0.7);
+        padding: 18px 20px;
+        overflow: hidden;
+        font-size: 14px;
+        line-height: 1.6;
+        color: #ffffff;
+      }
+
+      .output-lines {
+        margin-bottom: 4px;
+      }
+
+      .output-line {
+        display: block;
+        white-space: pre;
+        opacity: 0;
+        color: #ffffff;
+      }
+
+      .output-line.bold {
+        font-weight: bold;
+        color: #ffffff;
+      }
+
+      .output-line.dim {
+        color: rgba(255, 255, 255, 0.6);
+      }
+
+      .input-line {
+        display: flex;
+        align-items: center;
+        white-space: pre;
+      }
+
+      .prompt {
+        color: #888888;
+        font-weight: bold;
+        user-select: none;
+      }
+
+      .typed-command {
+        color: #ffffff;
+      }
+
+      .cursor-block {
+        display: inline-block;
+        width: 9px;
+        height: 16px;
+        background: #888888;
+        vertical-align: text-bottom;
+        margin-left: 1px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="scene"
+      data-composition-id="code-snippet-apple-terminal-clear-dark"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div class="terminal-window">
+        <div class="titlebar">
+          <div class="traffic-lights">
+            <span class="close"></span>
+            <span class="minimize"></span>
+            <span class="fullscreen"></span>
+          </div>
+          <span class="window-title">bash — 80×24</span>
+        </div>
+        <div class="terminal-canvas">
+          <div class="output-lines">
+            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys002</span>
+            <span class="output-line">Scanning dependencies...</span>
+            <span class="output-line">Found 3 vulnerabilities (1 moderate, 2 low)</span>
+            <span class="output-line dim">  package: lodash@4.17.20</span>
+            <span class="output-line dim">    severity: moderate</span>
+            <span class="output-line dim">    fix: lodash@4.17.21</span>
+            <span class="output-line dim">  package: minimist@1.2.5</span>
+            <span class="output-line dim">    severity: low</span>
+            <span class="output-line dim">    fix: minimist@1.2.6</span>
+            <span class="output-line bold">Run `npm audit fix` to fix them.</span>
+          </div>
+          <div class="input-line">
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+
+      const command = "npm audit";
+      const typedEl = document.querySelector(".typed-command");
+      const cursorEl = document.querySelector(".cursor-block");
+      const outputLines = document.querySelectorAll(".output-line");
+
+      const tl = gsap.timeline({ paused: true });
+
+      tl.set(typedEl, { text: "" }, 0);
+
+      const charDuration = 1.5 / command.length;
+      command.split("").forEach((char, i) => {
+        tl.add(() => {
+          typedEl.textContent = command.slice(0, i + 1);
+        }, 0.5 + i * charDuration);
+      });
+
+      tl.set(cursorEl, { opacity: 0 }, 2.2);
+      tl.set(outputLines[0], { opacity: 1 }, 2.3);
+
+      tl.add(() => {
+        typedEl.textContent = "";
+      }, 2.5);
+
+      outputLines.forEach((line, i) => {
+        if (i === 0) return;
+        tl.set(line, { opacity: 1 }, 2.8 + i * 0.1);
+      });
+
+      tl.add(() => {
+        const inputLine = document.querySelector(".input-line");
+        const newPrompt = document.createElement("div");
+        newPrompt.className = "input-line";
+        newPrompt.innerHTML =
+          '<span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block" id="final-cursor"></span>';
+        inputLine.style.display = "none";
+        inputLine.parentNode.appendChild(newPrompt);
+      }, 4.2);
+
+      const blinkTimes = [4.4, 4.8, 5.2, 5.6, 6.0, 6.4];
+      blinkTimes.forEach((t, i) => {
+        tl.add(() => {
+          const fc = document.getElementById("final-cursor");
+          if (fc) fc.style.opacity = i % 2 === 0 ? "0" : "1";
+        }, t);
+      });
+      tl.add(() => {
+        const fc = document.getElementById("final-cursor");
+        if (fc) fc.style.opacity = "1";
+      }, 6.8);
+
+      window.__timelines["code-snippet-apple-terminal-clear-dark"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json b/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
new file mode 100644
index 000000000..c2c3813d1
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "code-snippet-apple-terminal-clear-dark",
+  "type": "hyperframes:block",
+  "title": "Code Snippet - Apple Terminal Clear Dark",
+  "description": "Apple Terminal Clear Dark profile: semi-transparent dark background, per-character typing animation of a shell session.",
+  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 12,
+  "files": [
+    {
+      "path": "code-snippet-apple-terminal-clear-dark.html",
+      "target": "compositions/code-snippet-apple-terminal-clear-dark.html",
+      "type": "hyperframes:composition"
+    }
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-dark.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-dark.png"
+  }
+}
diff --git a/registry/blocks/code-snippet-apple-terminal-clear-light/code-snippet-apple-terminal-clear-light.html b/registry/blocks/code-snippet-apple-terminal-clear-light/code-snippet-apple-terminal-clear-light.html
new file mode 100644
index 000000000..1a604ab1f
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-clear-light/code-snippet-apple-terminal-clear-light.html
@@ -0,0 +1,240 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=1920, height=1080" />
+    <title>Apple Terminal Clear Light</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        font-family: "SF Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      #scene {
+        width: 1920px;
+        height: 1080px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: linear-gradient(135deg, #f5f5f5 0%, #e8e8e8 100%);
+      }
+
+      .terminal-window {
+        width: 1400px;
+        height: 700px;
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow:
+          0 30px 80px rgba(0, 0, 0, 0.18),
+          0 10px 30px rgba(0, 0, 0, 0.1);
+        display: flex;
+        flex-direction: column;
+      }
+
+      .titlebar {
+        height: 38px;
+        background: rgba(255, 255, 255, 0.4);
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        flex-shrink: 0;
+        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
+        position: relative;
+        backdrop-filter: blur(10px);
+      }
+
+      .traffic-lights {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .traffic-lights span {
+        width: 13px;
+        height: 13px;
+        border-radius: 50%;
+        display: inline-block;
+      }
+
+      .traffic-lights .close {
+        background: #ff5f57;
+        border: 1px solid #e0443e;
+      }
+
+      .traffic-lights .minimize {
+        background: #ffbd2e;
+        border: 1px solid #dfa123;
+      }
+
+      .traffic-lights .fullscreen {
+        background: #28c840;
+        border: 1px solid #1aab29;
+      }
+
+      .window-title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-size: 13px;
+        color: #333333;
+        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
+        font-weight: 500;
+        letter-spacing: -0.1px;
+      }
+
+      .terminal-canvas {
+        flex: 1;
+        background: rgba(255, 255, 255, 0.7);
+        padding: 18px 20px;
+        overflow: hidden;
+        font-size: 14px;
+        line-height: 1.6;
+        color: #000000;
+        backdrop-filter: blur(8px);
+      }
+
+      .output-lines {
+        margin-bottom: 4px;
+      }
+
+      .output-line {
+        display: block;
+        white-space: pre;
+        opacity: 0;
+        color: #000000;
+      }
+
+      .output-line.bold {
+        font-weight: bold;
+      }
+
+      .output-line.muted {
+        color: #666666;
+      }
+
+      .input-line {
+        display: flex;
+        align-items: center;
+        white-space: pre;
+      }
+
+      .prompt {
+        color: #888888;
+        font-weight: bold;
+        user-select: none;
+      }
+
+      .typed-command {
+        color: #000000;
+      }
+
+      .cursor-block {
+        display: inline-block;
+        width: 9px;
+        height: 16px;
+        background: #888888;
+        vertical-align: text-bottom;
+        margin-left: 1px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="scene"
+      data-composition-id="code-snippet-apple-terminal-clear-light"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div class="terminal-window">
+        <div class="titlebar">
+          <div class="traffic-lights">
+            <span class="close"></span>
+            <span class="minimize"></span>
+            <span class="fullscreen"></span>
+          </div>
+          <span class="window-title">bash — 80×24</span>
+        </div>
+        <div class="terminal-canvas">
+          <div class="output-lines">
+            <span class="output-line muted">Last login: Mon Jun  2 09:14:22 on ttys003</span>
+            <span class="output-line bold">git log --oneline -8</span>
+            <span class="output-line">a3f2c19 fix: correct off-by-one in pagination</span>
+            <span class="output-line">b7e8d04 feat: add dark mode toggle</span>
+            <span class="output-line">c1a9f55 refactor: extract auth helpers</span>
+            <span class="output-line">d4e2b31 test: add unit tests for parser</span>
+            <span class="output-line">e6c8a72 docs: update API reference</span>
+            <span class="output-line">f9b1d44 chore: bump dependencies</span>
+            <span class="output-line">2a7e890 feat: implement search endpoint</span>
+            <span class="output-line">3c5f012 init: project bootstrap</span>
+          </div>
+          <div class="input-line">
+            <span class="prompt">user@Mac myproject % </span><span class="typed-command"></span><span class="cursor-block"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+
+      const command = "git log --oneline -8";
+      const typedEl = document.querySelector(".typed-command");
+      const cursorEl = document.querySelector(".cursor-block");
+      const outputLines = document.querySelectorAll(".output-line");
+
+      const tl = gsap.timeline({ paused: true });
+
+      tl.set(typedEl, { text: "" }, 0);
+
+      const charDuration = 1.5 / command.length;
+      command.split("").forEach((char, i) => {
+        tl.add(() => {
+          typedEl.textContent = command.slice(0, i + 1);
+        }, 0.5 + i * charDuration);
+      });
+
+      tl.set(cursorEl, { opacity: 0 }, 2.2);
+      tl.set(outputLines[0], { opacity: 1 }, 2.3);
+
+      tl.add(() => {
+        typedEl.textContent = "";
+      }, 2.5);
+
+      outputLines.forEach((line, i) => {
+        if (i === 0) return;
+        tl.set(line, { opacity: 1 }, 2.8 + i * 0.09);
+      });
+
+      tl.add(() => {
+        const inputLine = document.querySelector(".input-line");
+        const newPrompt = document.createElement("div");
+        newPrompt.className = "input-line";
+        newPrompt.innerHTML =
+          '<span class="prompt">user@Mac myproject % </span><span class="typed-command"></span><span class="cursor-block" id="final-cursor"></span>';
+        inputLine.style.display = "none";
+        inputLine.parentNode.appendChild(newPrompt);
+      }, 4.0);
+
+      const blinkTimes = [4.2, 4.6, 5.0, 5.4, 5.8, 6.2];
+      blinkTimes.forEach((t, i) => {
+        tl.add(() => {
+          const fc = document.getElementById("final-cursor");
+          if (fc) fc.style.opacity = i % 2 === 0 ? "0" : "1";
+        }, t);
+      });
+      tl.add(() => {
+        const fc = document.getElementById("final-cursor");
+        if (fc) fc.style.opacity = "1";
+      }, 6.6);
+
+      window.__timelines["code-snippet-apple-terminal-clear-light"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/code-snippet-apple-terminal-clear-light/registry-item.json b/registry/blocks/code-snippet-apple-terminal-clear-light/registry-item.json
new file mode 100644
index 000000000..0e0c379de
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-clear-light/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "code-snippet-apple-terminal-clear-light",
+  "type": "hyperframes:block",
+  "title": "Code Snippet - Apple Terminal Clear Light",
+  "description": "Apple Terminal Clear Light profile: semi-transparent light background, per-character typing animation of a shell session.",
+  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 12,
+  "files": [
+    {
+      "path": "code-snippet-apple-terminal-clear-light.html",
+      "target": "compositions/code-snippet-apple-terminal-clear-light.html",
+      "type": "hyperframes:composition"
+    }
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-light.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-light.png"
+  }
+}
diff --git a/registry/blocks/code-snippet-apple-terminal-grass/code-snippet-apple-terminal-grass.html b/registry/blocks/code-snippet-apple-terminal-grass/code-snippet-apple-terminal-grass.html
new file mode 100644
index 000000000..4e8616c64
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-grass/code-snippet-apple-terminal-grass.html
@@ -0,0 +1,239 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=1920, height=1080" />
+    <title>Apple Terminal Grass</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        background: #000000;
+        font-family: "SF Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      #scene {
+        width: 1920px;
+        height: 1080px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: radial-gradient(ellipse at center, #0a1a0a 0%, #000000 70%);
+      }
+
+      .terminal-window {
+        width: 1400px;
+        height: 700px;
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow:
+          0 30px 80px rgba(0, 193, 0, 0.15),
+          0 10px 30px rgba(0, 0, 0, 0.8);
+        display: flex;
+        flex-direction: column;
+      }
+
+      .titlebar {
+        height: 38px;
+        background: #1c1c1c;
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        flex-shrink: 0;
+        border-bottom: 1px solid #00c100;
+        position: relative;
+      }
+
+      .traffic-lights {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .traffic-lights span {
+        width: 13px;
+        height: 13px;
+        border-radius: 50%;
+        display: inline-block;
+      }
+
+      .traffic-lights .close {
+        background: #ff5f57;
+        border: 1px solid #e0443e;
+      }
+
+      .traffic-lights .minimize {
+        background: #ffbd2e;
+        border: 1px solid #dfa123;
+      }
+
+      .traffic-lights .fullscreen {
+        background: #28c840;
+        border: 1px solid #1aab29;
+      }
+
+      .window-title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-size: 13px;
+        color: #00c100;
+        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
+        font-weight: 500;
+        letter-spacing: -0.1px;
+      }
+
+      .terminal-canvas {
+        flex: 1;
+        background: #000000;
+        padding: 18px 20px;
+        overflow: hidden;
+        font-size: 14px;
+        line-height: 1.6;
+        color: #00c100;
+      }
+
+      .output-lines {
+        margin-bottom: 4px;
+      }
+
+      .output-line {
+        display: block;
+        white-space: pre;
+        opacity: 0;
+        color: #00c100;
+      }
+
+      .output-line.bold {
+        font-weight: bold;
+        color: #00c100;
+      }
+
+      .output-line.dim {
+        color: #006600;
+      }
+
+      .input-line {
+        display: flex;
+        align-items: center;
+        white-space: pre;
+      }
+
+      .prompt {
+        color: #00c100;
+        font-weight: bold;
+        user-select: none;
+      }
+
+      .typed-command {
+        color: #00c100;
+      }
+
+      .cursor-block {
+        display: inline-block;
+        width: 9px;
+        height: 16px;
+        background: #00c100;
+        vertical-align: text-bottom;
+        margin-left: 1px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="scene"
+      data-composition-id="code-snippet-apple-terminal-grass"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div class="terminal-window">
+        <div class="titlebar">
+          <div class="traffic-lights">
+            <span class="close"></span>
+            <span class="minimize"></span>
+            <span class="fullscreen"></span>
+          </div>
+          <span class="window-title">bash — 80×24</span>
+        </div>
+        <div class="terminal-canvas">
+          <div class="output-lines">
+            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys004</span>
+            <span class="output-line">Running test suite...</span>
+            <span class="output-line dim">  ✓ should initialize with defaults (2ms)</span>
+            <span class="output-line dim">  ✓ should parse config correctly (4ms)</span>
+            <span class="output-line dim">  ✓ should handle empty input (1ms)</span>
+            <span class="output-line dim">  ✓ should reject invalid tokens (3ms)</span>
+            <span class="output-line dim">  ✓ should emit events on change (5ms)</span>
+            <span class="output-line dim">  ✓ should clean up on destroy (2ms)</span>
+            <span class="output-line bold">  6 passing (18ms)</span>
+          </div>
+          <div class="input-line">
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+
+      const command = "npm test";
+      const typedEl = document.querySelector(".typed-command");
+      const cursorEl = document.querySelector(".cursor-block");
+      const outputLines = document.querySelectorAll(".output-line");
+
+      const tl = gsap.timeline({ paused: true });
+
+      tl.set(typedEl, { text: "" }, 0);
+
+      const charDuration = 1.5 / command.length;
+      command.split("").forEach((char, i) => {
+        tl.add(() => {
+          typedEl.textContent = command.slice(0, i + 1);
+        }, 0.5 + i * charDuration);
+      });
+
+      tl.set(cursorEl, { opacity: 0 }, 2.2);
+      tl.set(outputLines[0], { opacity: 1 }, 2.3);
+
+      tl.add(() => {
+        typedEl.textContent = "";
+      }, 2.5);
+
+      outputLines.forEach((line, i) => {
+        if (i === 0) return;
+        tl.set(line, { opacity: 1 }, 2.8 + i * 0.12);
+      });
+
+      tl.add(() => {
+        const inputLine = document.querySelector(".input-line");
+        const newPrompt = document.createElement("div");
+        newPrompt.className = "input-line";
+        newPrompt.innerHTML =
+          '<span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block" id="final-cursor"></span>';
+        inputLine.style.display = "none";
+        inputLine.parentNode.appendChild(newPrompt);
+      }, 4.0);
+
+      const blinkTimes = [4.2, 4.6, 5.0, 5.4, 5.8, 6.2];
+      blinkTimes.forEach((t, i) => {
+        tl.add(() => {
+          const fc = document.getElementById("final-cursor");
+          if (fc) fc.style.opacity = i % 2 === 0 ? "0" : "1";
+        }, t);
+      });
+      tl.add(() => {
+        const fc = document.getElementById("final-cursor");
+        if (fc) fc.style.opacity = "1";
+      }, 6.6);
+
+      window.__timelines["code-snippet-apple-terminal-grass"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/code-snippet-apple-terminal-grass/registry-item.json b/registry/blocks/code-snippet-apple-terminal-grass/registry-item.json
new file mode 100644
index 000000000..d1fc5f38e
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-grass/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "code-snippet-apple-terminal-grass",
+  "type": "hyperframes:block",
+  "title": "Code Snippet - Apple Terminal Grass",
+  "description": "Apple Terminal Grass profile: black background with green text, per-character typing animation of a shell session.",
+  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 12,
+  "files": [
+    {
+      "path": "code-snippet-apple-terminal-grass.html",
+      "target": "compositions/code-snippet-apple-terminal-grass.html",
+      "type": "hyperframes:composition"
+    }
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-grass.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-grass.png"
+  }
+}
diff --git a/registry/blocks/code-snippet-apple-terminal-homebrew/code-snippet-apple-terminal-homebrew.html b/registry/blocks/code-snippet-apple-terminal-homebrew/code-snippet-apple-terminal-homebrew.html
new file mode 100644
index 000000000..c7a7646fb
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-homebrew/code-snippet-apple-terminal-homebrew.html
@@ -0,0 +1,244 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=1920, height=1080" />
+    <title>Apple Terminal Homebrew</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        background: #000000;
+        font-family: "SF Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      #scene {
+        width: 1920px;
+        height: 1080px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: radial-gradient(ellipse at center, #0d1a0d 0%, #000000 70%);
+      }
+
+      .terminal-window {
+        width: 1400px;
+        height: 700px;
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow:
+          0 30px 80px rgba(0, 207, 0, 0.18),
+          0 10px 30px rgba(0, 0, 0, 0.85);
+        display: flex;
+        flex-direction: column;
+      }
+
+      .titlebar {
+        height: 38px;
+        background: #1c1c1c;
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        flex-shrink: 0;
+        border-bottom: 1px solid #006900;
+        position: relative;
+      }
+
+      .traffic-lights {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .traffic-lights span {
+        width: 13px;
+        height: 13px;
+        border-radius: 50%;
+        display: inline-block;
+      }
+
+      .traffic-lights .close {
+        background: #ff5f57;
+        border: 1px solid #e0443e;
+      }
+
+      .traffic-lights .minimize {
+        background: #ffbd2e;
+        border: 1px solid #dfa123;
+      }
+
+      .traffic-lights .fullscreen {
+        background: #28c840;
+        border: 1px solid #1aab29;
+      }
+
+      .window-title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-size: 13px;
+        color: #00cf00;
+        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
+        font-weight: 500;
+        letter-spacing: -0.1px;
+      }
+
+      .terminal-canvas {
+        flex: 1;
+        background: #000000;
+        padding: 18px 20px;
+        overflow: hidden;
+        font-size: 14px;
+        line-height: 1.6;
+        color: #00cf00;
+      }
+
+      .output-lines {
+        margin-bottom: 4px;
+      }
+
+      .output-line {
+        display: block;
+        white-space: pre;
+        opacity: 0;
+        color: #00cf00;
+      }
+
+      .output-line.bold {
+        font-weight: bold;
+        color: #00de00;
+      }
+
+      .output-line.dim {
+        color: #006600;
+      }
+
+      .output-line.bright {
+        color: #48f800;
+        font-weight: bold;
+      }
+
+      .input-line {
+        display: flex;
+        align-items: center;
+        white-space: pre;
+      }
+
+      .prompt {
+        color: #48f800;
+        font-weight: bold;
+        user-select: none;
+      }
+
+      .typed-command {
+        color: #00cf00;
+      }
+
+      .cursor-block {
+        display: inline-block;
+        width: 9px;
+        height: 16px;
+        background: #48f800;
+        vertical-align: text-bottom;
+        margin-left: 1px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="scene"
+      data-composition-id="code-snippet-apple-terminal-homebrew"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div class="terminal-window">
+        <div class="titlebar">
+          <div class="traffic-lights">
+            <span class="close"></span>
+            <span class="minimize"></span>
+            <span class="fullscreen"></span>
+          </div>
+          <span class="window-title">bash — 80×24</span>
+        </div>
+        <div class="terminal-canvas">
+          <div class="output-lines">
+            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys005</span>
+            <span class="output-line">==> Updating Homebrew...</span>
+            <span class="output-line dim">Already up-to-date.</span>
+            <span class="output-line">==> Outdated formulae</span>
+            <span class="output-line">node 20.11.0 -> 22.3.0</span>
+            <span class="output-line">python 3.11.6 -> 3.12.4</span>
+            <span class="output-line">git 2.43.0 -> 2.45.2</span>
+            <span class="output-line">ffmpeg 6.1.1 -> 7.0.0</span>
+            <span class="output-line bright">==> Run `brew upgrade` to update 4 formulae.</span>
+          </div>
+          <div class="input-line">
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+
+      const command = "brew outdated";
+      const typedEl = document.querySelector(".typed-command");
+      const cursorEl = document.querySelector(".cursor-block");
+      const outputLines = document.querySelectorAll(".output-line");
+
+      const tl = gsap.timeline({ paused: true });
+
+      tl.set(typedEl, { text: "" }, 0);
+
+      const charDuration = 1.5 / command.length;
+      command.split("").forEach((char, i) => {
+        tl.add(() => {
+          typedEl.textContent = command.slice(0, i + 1);
+        }, 0.5 + i * charDuration);
+      });
+
+      tl.set(cursorEl, { opacity: 0 }, 2.2);
+      tl.set(outputLines[0], { opacity: 1 }, 2.3);
+
+      tl.add(() => {
+        typedEl.textContent = "";
+      }, 2.5);
+
+      outputLines.forEach((line, i) => {
+        if (i === 0) return;
+        tl.set(line, { opacity: 1 }, 2.8 + i * 0.1);
+      });
+
+      tl.add(() => {
+        const inputLine = document.querySelector(".input-line");
+        const newPrompt = document.createElement("div");
+        newPrompt.className = "input-line";
+        newPrompt.innerHTML =
+          '<span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block" id="final-cursor"></span>';
+        inputLine.style.display = "none";
+        inputLine.parentNode.appendChild(newPrompt);
+      }, 4.2);
+
+      const blinkTimes = [4.4, 4.8, 5.2, 5.6, 6.0, 6.4];
+      blinkTimes.forEach((t, i) => {
+        tl.add(() => {
+          const fc = document.getElementById("final-cursor");
+          if (fc) fc.style.opacity = i % 2 === 0 ? "0" : "1";
+        }, t);
+      });
+      tl.add(() => {
+        const fc = document.getElementById("final-cursor");
+        if (fc) fc.style.opacity = "1";
+      }, 6.8);
+
+      window.__timelines["code-snippet-apple-terminal-homebrew"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json b/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
new file mode 100644
index 000000000..67cfb0017
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "code-snippet-apple-terminal-homebrew",
+  "type": "hyperframes:block",
+  "title": "Code Snippet - Apple Terminal Homebrew",
+  "description": "Apple Terminal Homebrew profile: black background with bright green text and lime cursor, per-character typing animation of a shell session.",
+  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 12,
+  "files": [
+    {
+      "path": "code-snippet-apple-terminal-homebrew.html",
+      "target": "compositions/code-snippet-apple-terminal-homebrew.html",
+      "type": "hyperframes:composition"
+    }
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-homebrew.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-homebrew.png"
+  }
+}
diff --git a/registry/blocks/code-snippet-apple-terminal-man-page/code-snippet-apple-terminal-man-page.html b/registry/blocks/code-snippet-apple-terminal-man-page/code-snippet-apple-terminal-man-page.html
new file mode 100644
index 000000000..4c0d428ec
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-man-page/code-snippet-apple-terminal-man-page.html
@@ -0,0 +1,242 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=1920, height=1080" />
+    <title>Apple Terminal Man Page</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        font-family: "SF Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      #scene {
+        width: 1920px;
+        height: 1080px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: linear-gradient(135deg, #ede87a 0%, #ddd566 100%);
+      }
+
+      .terminal-window {
+        width: 1400px;
+        height: 700px;
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow:
+          0 30px 80px rgba(0, 0, 0, 0.2),
+          0 10px 30px rgba(0, 0, 0, 0.12);
+        display: flex;
+        flex-direction: column;
+      }
+
+      .titlebar {
+        height: 38px;
+        background: #f0e680;
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        flex-shrink: 0;
+        border-bottom: 1px solid #c8be40;
+        position: relative;
+      }
+
+      .traffic-lights {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .traffic-lights span {
+        width: 13px;
+        height: 13px;
+        border-radius: 50%;
+        display: inline-block;
+      }
+
+      .traffic-lights .close {
+        background: #ff5f57;
+        border: 1px solid #e0443e;
+      }
+
+      .traffic-lights .minimize {
+        background: #ffbd2e;
+        border: 1px solid #dfa123;
+      }
+
+      .traffic-lights .fullscreen {
+        background: #28c840;
+        border: 1px solid #1aab29;
+      }
+
+      .window-title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-size: 13px;
+        color: #333333;
+        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
+        font-weight: 500;
+        letter-spacing: -0.1px;
+      }
+
+      .terminal-canvas {
+        flex: 1;
+        background: #fef49c;
+        padding: 18px 20px;
+        overflow: hidden;
+        font-size: 14px;
+        line-height: 1.6;
+        color: #000000;
+      }
+
+      .output-lines {
+        margin-bottom: 4px;
+      }
+
+      .output-line {
+        display: block;
+        white-space: pre;
+        opacity: 0;
+        color: #000000;
+      }
+
+      .output-line.bold {
+        font-weight: bold;
+      }
+
+      .output-line.indent {
+        padding-left: 24px;
+        color: #222222;
+      }
+
+      .output-line.section {
+        font-weight: bold;
+        margin-top: 2px;
+      }
+
+      .input-line {
+        display: flex;
+        align-items: center;
+        white-space: pre;
+      }
+
+      .prompt {
+        color: #000000;
+        font-weight: bold;
+        user-select: none;
+      }
+
+      .typed-command {
+        color: #000000;
+      }
+
+      .cursor-block {
+        display: inline-block;
+        width: 9px;
+        height: 16px;
+        background: #000000;
+        vertical-align: text-bottom;
+        margin-left: 1px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="scene"
+      data-composition-id="code-snippet-apple-terminal-man-page"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div class="terminal-window">
+        <div class="titlebar">
+          <div class="traffic-lights">
+            <span class="close"></span>
+            <span class="minimize"></span>
+            <span class="fullscreen"></span>
+          </div>
+          <span class="window-title">man — 80×24</span>
+        </div>
+        <div class="terminal-canvas">
+          <div class="output-lines">
+            <span class="output-line section">CURL(1)                   General Commands Manual                  CURL(1)</span>
+            <span class="output-line"></span>
+            <span class="output-line section">NAME</span>
+            <span class="output-line indent">curl -- transfer a URL</span>
+            <span class="output-line"></span>
+            <span class="output-line section">SYNOPSIS</span>
+            <span class="output-line indent">curl [options / URLs]</span>
+            <span class="output-line"></span>
+            <span class="output-line section">DESCRIPTION</span>
+            <span class="output-line indent">curl is a tool for transferring data from or to a server using URLs.</span>
+          </div>
+          <div class="input-line">
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+
+      const command = "man curl";
+      const typedEl = document.querySelector(".typed-command");
+      const cursorEl = document.querySelector(".cursor-block");
+      const outputLines = document.querySelectorAll(".output-line");
+
+      const tl = gsap.timeline({ paused: true });
+
+      tl.set(typedEl, { text: "" }, 0);
+
+      const charDuration = 1.5 / command.length;
+      command.split("").forEach((char, i) => {
+        tl.add(() => {
+          typedEl.textContent = command.slice(0, i + 1);
+        }, 0.5 + i * charDuration);
+      });
+
+      tl.set(cursorEl, { opacity: 0 }, 2.2);
+
+      tl.add(() => {
+        typedEl.textContent = "";
+      }, 2.4);
+
+      outputLines.forEach((line, i) => {
+        tl.set(line, { opacity: 1 }, 2.5 + i * 0.1);
+      });
+
+      tl.add(() => {
+        const inputLine = document.querySelector(".input-line");
+        const newPrompt = document.createElement("div");
+        newPrompt.className = "input-line";
+        newPrompt.innerHTML =
+          '<span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block" id="final-cursor"></span>';
+        inputLine.style.display = "none";
+        inputLine.parentNode.appendChild(newPrompt);
+      }, 4.0);
+
+      const blinkTimes = [4.2, 4.6, 5.0, 5.4, 5.8, 6.2];
+      blinkTimes.forEach((t, i) => {
+        tl.add(() => {
+          const fc = document.getElementById("final-cursor");
+          if (fc) fc.style.opacity = i % 2 === 0 ? "0" : "1";
+        }, t);
+      });
+      tl.add(() => {
+        const fc = document.getElementById("final-cursor");
+        if (fc) fc.style.opacity = "1";
+      }, 6.6);
+
+      window.__timelines["code-snippet-apple-terminal-man-page"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/code-snippet-apple-terminal-man-page/registry-item.json b/registry/blocks/code-snippet-apple-terminal-man-page/registry-item.json
new file mode 100644
index 000000000..8d5b262bb
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-man-page/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "code-snippet-apple-terminal-man-page",
+  "type": "hyperframes:block",
+  "title": "Code Snippet - Apple Terminal Man Page",
+  "description": "Apple Terminal Man Page profile: pale yellow background with black text, per-character typing animation of a shell session.",
+  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 12,
+  "files": [
+    {
+      "path": "code-snippet-apple-terminal-man-page.html",
+      "target": "compositions/code-snippet-apple-terminal-man-page.html",
+      "type": "hyperframes:composition"
+    }
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-man-page.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-man-page.png"
+  }
+}
diff --git a/registry/blocks/code-snippet-apple-terminal-novel/code-snippet-apple-terminal-novel.html b/registry/blocks/code-snippet-apple-terminal-novel/code-snippet-apple-terminal-novel.html
new file mode 100644
index 000000000..4ed9246c9
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-novel/code-snippet-apple-terminal-novel.html
@@ -0,0 +1,238 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=1920, height=1080" />
+    <title>Apple Terminal Novel</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        font-family: "SF Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      #scene {
+        width: 1920px;
+        height: 1080px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: linear-gradient(135deg, #c9a86c 0%, #b8955a 100%);
+      }
+
+      .terminal-window {
+        width: 1400px;
+        height: 700px;
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow:
+          0 30px 80px rgba(62, 41, 0, 0.3),
+          0 10px 30px rgba(0, 0, 0, 0.15);
+        display: flex;
+        flex-direction: column;
+      }
+
+      .titlebar {
+        height: 38px;
+        background: #c9a86c;
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        flex-shrink: 0;
+        border-bottom: 1px solid #a88040;
+        position: relative;
+      }
+
+      .traffic-lights {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .traffic-lights span {
+        width: 13px;
+        height: 13px;
+        border-radius: 50%;
+        display: inline-block;
+      }
+
+      .traffic-lights .close {
+        background: #ff5f57;
+        border: 1px solid #e0443e;
+      }
+
+      .traffic-lights .minimize {
+        background: #ffbd2e;
+        border: 1px solid #dfa123;
+      }
+
+      .traffic-lights .fullscreen {
+        background: #28c840;
+        border: 1px solid #1aab29;
+      }
+
+      .window-title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-size: 13px;
+        color: #3e2900;
+        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
+        font-weight: 600;
+        letter-spacing: -0.1px;
+      }
+
+      .terminal-canvas {
+        flex: 1;
+        background: #dfc18a;
+        padding: 18px 20px;
+        overflow: hidden;
+        font-size: 14px;
+        line-height: 1.6;
+        color: #3e2900;
+      }
+
+      .output-lines {
+        margin-bottom: 4px;
+      }
+
+      .output-line {
+        display: block;
+        white-space: pre;
+        opacity: 0;
+        color: #3e2900;
+      }
+
+      .output-line.bold {
+        font-weight: bold;
+        color: #3e2900;
+      }
+
+      .output-line.muted {
+        color: #7a5a20;
+      }
+
+      .input-line {
+        display: flex;
+        align-items: center;
+        white-space: pre;
+      }
+
+      .prompt {
+        color: #3e2900;
+        font-weight: bold;
+        user-select: none;
+      }
+
+      .typed-command {
+        color: #3e2900;
+      }
+
+      .cursor-block {
+        display: inline-block;
+        width: 9px;
+        height: 16px;
+        background: #3e2900;
+        vertical-align: text-bottom;
+        margin-left: 1px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="scene"
+      data-composition-id="code-snippet-apple-terminal-novel"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div class="terminal-window">
+        <div class="titlebar">
+          <div class="traffic-lights">
+            <span class="close"></span>
+            <span class="minimize"></span>
+            <span class="fullscreen"></span>
+          </div>
+          <span class="window-title">bash — 80×24</span>
+        </div>
+        <div class="terminal-canvas">
+          <div class="output-lines">
+            <span class="output-line muted">Last login: Mon Jun  2 09:14:22 on ttys006</span>
+            <span class="output-line muted">Python 3.12.4 (main, Jun 6 2024, 18:26:44)</span>
+            <span class="output-line muted">Type "help", "copyright", "credits" or "license" for more information.</span>
+            <span class="output-line bold">>>> import hyperframes</span>
+            <span class="output-line bold">>>> hf = hyperframes.Composition("intro.html")</span>
+            <span class="output-line">>>> hf.duration</span>
+            <span class="output-line">12.0</span>
+            <span class="output-line">>>> hf.dimensions</span>
+            <span class="output-line">Dimensions(width=1920, height=1080)</span>
+          </div>
+          <div class="input-line">
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+
+      const command = "python3";
+      const typedEl = document.querySelector(".typed-command");
+      const cursorEl = document.querySelector(".cursor-block");
+      const outputLines = document.querySelectorAll(".output-line");
+
+      const tl = gsap.timeline({ paused: true });
+
+      tl.set(typedEl, { text: "" }, 0);
+
+      const charDuration = 1.5 / command.length;
+      command.split("").forEach((char, i) => {
+        tl.add(() => {
+          typedEl.textContent = command.slice(0, i + 1);
+        }, 0.5 + i * charDuration);
+      });
+
+      tl.set(cursorEl, { opacity: 0 }, 2.2);
+      tl.set(outputLines[0], { opacity: 1 }, 2.3);
+
+      tl.add(() => {
+        typedEl.textContent = "";
+      }, 2.5);
+
+      outputLines.forEach((line, i) => {
+        if (i === 0) return;
+        tl.set(line, { opacity: 1 }, 2.8 + i * 0.1);
+      });
+
+      tl.add(() => {
+        const inputLine = document.querySelector(".input-line");
+        const newPrompt = document.createElement("div");
+        newPrompt.className = "input-line";
+        newPrompt.innerHTML =
+          '<span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block" id="final-cursor"></span>';
+        inputLine.style.display = "none";
+        inputLine.parentNode.appendChild(newPrompt);
+      }, 4.2);
+
+      const blinkTimes = [4.4, 4.8, 5.2, 5.6, 6.0, 6.4];
+      blinkTimes.forEach((t, i) => {
+        tl.add(() => {
+          const fc = document.getElementById("final-cursor");
+          if (fc) fc.style.opacity = i % 2 === 0 ? "0" : "1";
+        }, t);
+      });
+      tl.add(() => {
+        const fc = document.getElementById("final-cursor");
+        if (fc) fc.style.opacity = "1";
+      }, 6.8);
+
+      window.__timelines["code-snippet-apple-terminal-novel"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json b/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
new file mode 100644
index 000000000..007526692
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "code-snippet-apple-terminal-novel",
+  "type": "hyperframes:block",
+  "title": "Code Snippet - Apple Terminal Novel",
+  "description": "Apple Terminal Novel profile: warm parchment background with dark brown text, per-character typing animation of a shell session.",
+  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 12,
+  "files": [
+    {
+      "path": "code-snippet-apple-terminal-novel.html",
+      "target": "compositions/code-snippet-apple-terminal-novel.html",
+      "type": "hyperframes:composition"
+    }
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-novel.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-novel.png"
+  }
+}
diff --git a/registry/blocks/code-snippet-apple-terminal-ocean/code-snippet-apple-terminal-ocean.html b/registry/blocks/code-snippet-apple-terminal-ocean/code-snippet-apple-terminal-ocean.html
new file mode 100644
index 000000000..df8fbe1ed
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-ocean/code-snippet-apple-terminal-ocean.html
@@ -0,0 +1,243 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=1920, height=1080" />
+    <title>Apple Terminal Ocean</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        background: #1a3f9e;
+        font-family: "SF Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      #scene {
+        width: 1920px;
+        height: 1080px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: radial-gradient(ellipse at center, #224fbe 0%, #0e2878 100%);
+      }
+
+      .terminal-window {
+        width: 1400px;
+        height: 700px;
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow:
+          0 30px 80px rgba(0, 0, 0, 0.6),
+          0 10px 30px rgba(34, 79, 190, 0.3);
+        display: flex;
+        flex-direction: column;
+      }
+
+      .titlebar {
+        height: 38px;
+        background: #1a3f9e;
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        flex-shrink: 0;
+        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
+        position: relative;
+      }
+
+      .traffic-lights {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .traffic-lights span {
+        width: 13px;
+        height: 13px;
+        border-radius: 50%;
+        display: inline-block;
+      }
+
+      .traffic-lights .close {
+        background: #ff5f57;
+        border: 1px solid #e0443e;
+      }
+
+      .traffic-lights .minimize {
+        background: #ffbd2e;
+        border: 1px solid #dfa123;
+      }
+
+      .traffic-lights .fullscreen {
+        background: #28c840;
+        border: 1px solid #1aab29;
+      }
+
+      .window-title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-size: 13px;
+        color: #ffffff;
+        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
+        font-weight: 500;
+        letter-spacing: -0.1px;
+      }
+
+      .terminal-canvas {
+        flex: 1;
+        background: #224fbe;
+        padding: 18px 20px;
+        overflow: hidden;
+        font-size: 14px;
+        line-height: 1.6;
+        color: #ffffff;
+      }
+
+      .output-lines {
+        margin-bottom: 4px;
+      }
+
+      .output-line {
+        display: block;
+        white-space: pre;
+        opacity: 0;
+        color: #ffffff;
+      }
+
+      .output-line.bold {
+        font-weight: bold;
+        color: #ffffff;
+      }
+
+      .output-line.dim {
+        color: rgba(255, 255, 255, 0.65);
+      }
+
+      .output-line.success {
+        color: #7fffb3;
+        font-weight: bold;
+      }
+
+      .input-line {
+        display: flex;
+        align-items: center;
+        white-space: pre;
+      }
+
+      .prompt {
+        color: rgba(255, 255, 255, 0.8);
+        font-weight: bold;
+        user-select: none;
+      }
+
+      .typed-command {
+        color: #ffffff;
+      }
+
+      .cursor-block {
+        display: inline-block;
+        width: 9px;
+        height: 16px;
+        background: #ffffff;
+        vertical-align: text-bottom;
+        margin-left: 1px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="scene"
+      data-composition-id="code-snippet-apple-terminal-ocean"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div class="terminal-window">
+        <div class="titlebar">
+          <div class="traffic-lights">
+            <span class="close"></span>
+            <span class="minimize"></span>
+            <span class="fullscreen"></span>
+          </div>
+          <span class="window-title">bash — 80×24</span>
+        </div>
+        <div class="terminal-canvas">
+          <div class="output-lines">
+            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys007</span>
+            <span class="output-line bold">docker ps</span>
+            <span class="output-line dim">CONTAINER ID   IMAGE           COMMAND                  CREATED</span>
+            <span class="output-line">a1b2c3d4e5f6   nginx:latest    "/docker-entrypoint.…"   2 hours ago</span>
+            <span class="output-line">b2c3d4e5f6a7   postgres:15     "docker-entrypoint.s…"   2 hours ago</span>
+            <span class="output-line">c3d4e5f6a7b8   redis:alpine    "docker-entrypoint.s…"   2 hours ago</span>
+            <span class="output-line success">3 containers running</span>
+            <span class="output-line dim">Use 'docker logs CONTAINER' to view output</span>
+          </div>
+          <div class="input-line">
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+
+      const command = "docker ps";
+      const typedEl = document.querySelector(".typed-command");
+      const cursorEl = document.querySelector(".cursor-block");
+      const outputLines = document.querySelectorAll(".output-line");
+
+      const tl = gsap.timeline({ paused: true });
+
+      tl.set(typedEl, { text: "" }, 0);
+
+      const charDuration = 1.5 / command.length;
+      command.split("").forEach((char, i) => {
+        tl.add(() => {
+          typedEl.textContent = command.slice(0, i + 1);
+        }, 0.5 + i * charDuration);
+      });
+
+      tl.set(cursorEl, { opacity: 0 }, 2.2);
+      tl.set(outputLines[0], { opacity: 1 }, 2.3);
+
+      tl.add(() => {
+        typedEl.textContent = "";
+      }, 2.5);
+
+      outputLines.forEach((line, i) => {
+        if (i === 0) return;
+        tl.set(line, { opacity: 1 }, 2.8 + i * 0.1);
+      });
+
+      tl.add(() => {
+        const inputLine = document.querySelector(".input-line");
+        const newPrompt = document.createElement("div");
+        newPrompt.className = "input-line";
+        newPrompt.innerHTML =
+          '<span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block" id="final-cursor"></span>';
+        inputLine.style.display = "none";
+        inputLine.parentNode.appendChild(newPrompt);
+      }, 4.2);
+
+      const blinkTimes = [4.4, 4.8, 5.2, 5.6, 6.0, 6.4];
+      blinkTimes.forEach((t, i) => {
+        tl.add(() => {
+          const fc = document.getElementById("final-cursor");
+          if (fc) fc.style.opacity = i % 2 === 0 ? "0" : "1";
+        }, t);
+      });
+      tl.add(() => {
+        const fc = document.getElementById("final-cursor");
+        if (fc) fc.style.opacity = "1";
+      }, 6.8);
+
+      window.__timelines["code-snippet-apple-terminal-ocean"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json b/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
new file mode 100644
index 000000000..d280f3768
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "code-snippet-apple-terminal-ocean",
+  "type": "hyperframes:block",
+  "title": "Code Snippet - Apple Terminal Ocean",
+  "description": "Apple Terminal Ocean profile: deep blue background with white text, per-character typing animation of a shell session.",
+  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 12,
+  "files": [
+    {
+      "path": "code-snippet-apple-terminal-ocean.html",
+      "target": "compositions/code-snippet-apple-terminal-ocean.html",
+      "type": "hyperframes:composition"
+    }
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-ocean.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-ocean.png"
+  }
+}
diff --git a/registry/blocks/code-snippet-apple-terminal-pro/code-snippet-apple-terminal-pro.html b/registry/blocks/code-snippet-apple-terminal-pro/code-snippet-apple-terminal-pro.html
new file mode 100644
index 000000000..0a650a682
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-pro/code-snippet-apple-terminal-pro.html
@@ -0,0 +1,243 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=1920, height=1080" />
+    <title>Apple Terminal Pro</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        background: #000000;
+        font-family: "SF Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      #scene {
+        width: 1920px;
+        height: 1080px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: radial-gradient(ellipse at center, #141414 0%, #000000 70%);
+      }
+
+      .terminal-window {
+        width: 1400px;
+        height: 700px;
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow:
+          0 30px 80px rgba(136, 255, 103, 0.08),
+          0 10px 30px rgba(0, 0, 0, 0.9);
+        display: flex;
+        flex-direction: column;
+      }
+
+      .titlebar {
+        height: 38px;
+        background: #1c1c1c;
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        flex-shrink: 0;
+        border-bottom: 1px solid #333333;
+        position: relative;
+      }
+
+      .traffic-lights {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .traffic-lights span {
+        width: 13px;
+        height: 13px;
+        border-radius: 50%;
+        display: inline-block;
+      }
+
+      .traffic-lights .close {
+        background: #ff5f57;
+        border: 1px solid #e0443e;
+      }
+
+      .traffic-lights .minimize {
+        background: #ffbd2e;
+        border: 1px solid #dfa123;
+      }
+
+      .traffic-lights .fullscreen {
+        background: #28c840;
+        border: 1px solid #1aab29;
+      }
+
+      .window-title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-size: 13px;
+        color: #bbbbbb;
+        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
+        font-weight: 500;
+        letter-spacing: -0.1px;
+      }
+
+      .terminal-canvas {
+        flex: 1;
+        background: #000000;
+        padding: 18px 20px;
+        overflow: hidden;
+        font-size: 14px;
+        line-height: 1.6;
+        color: #bbbbbb;
+      }
+
+      .output-lines {
+        margin-bottom: 4px;
+      }
+
+      .output-line {
+        display: block;
+        white-space: pre;
+        opacity: 0;
+        color: #bbbbbb;
+      }
+
+      .output-line.bold {
+        font-weight: bold;
+        color: #ffffff;
+      }
+
+      .output-line.accent {
+        color: #88ff67;
+        font-weight: bold;
+      }
+
+      .output-line.dim {
+        color: #666666;
+      }
+
+      .input-line {
+        display: flex;
+        align-items: center;
+        white-space: pre;
+      }
+
+      .prompt {
+        color: #88ff67;
+        font-weight: bold;
+        user-select: none;
+      }
+
+      .typed-command {
+        color: #bbbbbb;
+      }
+
+      .cursor-block {
+        display: inline-block;
+        width: 9px;
+        height: 16px;
+        background: #88ff67;
+        vertical-align: text-bottom;
+        margin-left: 1px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="scene"
+      data-composition-id="code-snippet-apple-terminal-pro"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div class="terminal-window">
+        <div class="titlebar">
+          <div class="traffic-lights">
+            <span class="close"></span>
+            <span class="minimize"></span>
+            <span class="fullscreen"></span>
+          </div>
+          <span class="window-title">bash — 80×24</span>
+        </div>
+        <div class="terminal-canvas">
+          <div class="output-lines">
+            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys008</span>
+            <span class="output-line dim">Building production bundle...</span>
+            <span class="output-line">  vite v5.3.1 building for production...</span>
+            <span class="output-line">  ✓ 142 modules transformed.</span>
+            <span class="output-line">  dist/index.html             0.48 kB</span>
+            <span class="output-line">  dist/assets/index-Cv3rN.js  284.12 kB</span>
+            <span class="output-line">  dist/assets/index-Du4mP.css  42.08 kB</span>
+            <span class="output-line accent">  ✓ built in 2.31s</span>
+          </div>
+          <div class="input-line">
+            <span class="prompt">user@Mac myapp % </span><span class="typed-command"></span><span class="cursor-block"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+
+      const command = "npm run build";
+      const typedEl = document.querySelector(".typed-command");
+      const cursorEl = document.querySelector(".cursor-block");
+      const outputLines = document.querySelectorAll(".output-line");
+
+      const tl = gsap.timeline({ paused: true });
+
+      tl.set(typedEl, { text: "" }, 0);
+
+      const charDuration = 1.5 / command.length;
+      command.split("").forEach((char, i) => {
+        tl.add(() => {
+          typedEl.textContent = command.slice(0, i + 1);
+        }, 0.5 + i * charDuration);
+      });
+
+      tl.set(cursorEl, { opacity: 0 }, 2.2);
+      tl.set(outputLines[0], { opacity: 1 }, 2.3);
+
+      tl.add(() => {
+        typedEl.textContent = "";
+      }, 2.5);
+
+      outputLines.forEach((line, i) => {
+        if (i === 0) return;
+        tl.set(line, { opacity: 1 }, 2.8 + i * 0.1);
+      });
+
+      tl.add(() => {
+        const inputLine = document.querySelector(".input-line");
+        const newPrompt = document.createElement("div");
+        newPrompt.className = "input-line";
+        newPrompt.innerHTML =
+          '<span class="prompt">user@Mac myapp % </span><span class="typed-command"></span><span class="cursor-block" id="final-cursor"></span>';
+        inputLine.style.display = "none";
+        inputLine.parentNode.appendChild(newPrompt);
+      }, 4.2);
+
+      const blinkTimes = [4.4, 4.8, 5.2, 5.6, 6.0, 6.4];
+      blinkTimes.forEach((t, i) => {
+        tl.add(() => {
+          const fc = document.getElementById("final-cursor");
+          if (fc) fc.style.opacity = i % 2 === 0 ? "0" : "1";
+        }, t);
+      });
+      tl.add(() => {
+        const fc = document.getElementById("final-cursor");
+        if (fc) fc.style.opacity = "1";
+      }, 6.8);
+
+      window.__timelines["code-snippet-apple-terminal-pro"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json b/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
new file mode 100644
index 000000000..b54f8b885
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "code-snippet-apple-terminal-pro",
+  "type": "hyperframes:block",
+  "title": "Code Snippet - Apple Terminal Pro",
+  "description": "Apple Terminal Pro profile: black background with grey text and lime green cursor, per-character typing animation of a shell session.",
+  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 12,
+  "files": [
+    {
+      "path": "code-snippet-apple-terminal-pro.html",
+      "target": "compositions/code-snippet-apple-terminal-pro.html",
+      "type": "hyperframes:composition"
+    }
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-pro.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-pro.png"
+  }
+}
diff --git a/registry/blocks/code-snippet-apple-terminal-red-sands/code-snippet-apple-terminal-red-sands.html b/registry/blocks/code-snippet-apple-terminal-red-sands/code-snippet-apple-terminal-red-sands.html
new file mode 100644
index 000000000..d2a5c87a2
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-red-sands/code-snippet-apple-terminal-red-sands.html
@@ -0,0 +1,240 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=1920, height=1080" />
+    <title>Apple Terminal Red Sands</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        background: #7b140e;
+        font-family: "SF Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      #scene {
+        width: 1920px;
+        height: 1080px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: radial-gradient(ellipse at center, #8a1a12 0%, #4a0a06 100%);
+      }
+
+      .terminal-window {
+        width: 1400px;
+        height: 700px;
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow:
+          0 30px 80px rgba(0, 0, 0, 0.7),
+          0 10px 30px rgba(123, 20, 14, 0.4);
+        display: flex;
+        flex-direction: column;
+      }
+
+      .titlebar {
+        height: 38px;
+        background: #5e0f0a;
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        flex-shrink: 0;
+        border-bottom: 1px solid #8b2018;
+        position: relative;
+      }
+
+      .traffic-lights {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .traffic-lights span {
+        width: 13px;
+        height: 13px;
+        border-radius: 50%;
+        display: inline-block;
+      }
+
+      .traffic-lights .close {
+        background: #ff5f57;
+        border: 1px solid #e0443e;
+      }
+
+      .traffic-lights .minimize {
+        background: #ffbd2e;
+        border: 1px solid #dfa123;
+      }
+
+      .traffic-lights .fullscreen {
+        background: #28c840;
+        border: 1px solid #1aab29;
+      }
+
+      .window-title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-size: 13px;
+        color: #ffe1b9;
+        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
+        font-weight: 500;
+        letter-spacing: -0.1px;
+      }
+
+      .terminal-canvas {
+        flex: 1;
+        background: #7b140e;
+        padding: 18px 20px;
+        overflow: hidden;
+        font-size: 14px;
+        line-height: 1.6;
+        color: #ffe1b9;
+      }
+
+      .output-lines {
+        margin-bottom: 4px;
+      }
+
+      .output-line {
+        display: block;
+        white-space: pre;
+        opacity: 0;
+        color: #ffe1b9;
+      }
+
+      .output-line.bold {
+        font-weight: bold;
+        color: #ffffff;
+      }
+
+      .output-line.dim {
+        color: #c4916a;
+      }
+
+      .input-line {
+        display: flex;
+        align-items: center;
+        white-space: pre;
+      }
+
+      .prompt {
+        color: #ffe1b9;
+        font-weight: bold;
+        user-select: none;
+      }
+
+      .typed-command {
+        color: #ffe1b9;
+      }
+
+      .cursor-block {
+        display: inline-block;
+        width: 9px;
+        height: 16px;
+        background: #ffffff;
+        vertical-align: text-bottom;
+        margin-left: 1px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="scene"
+      data-composition-id="code-snippet-apple-terminal-red-sands"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div class="terminal-window">
+        <div class="titlebar">
+          <div class="traffic-lights">
+            <span class="close"></span>
+            <span class="minimize"></span>
+            <span class="fullscreen"></span>
+          </div>
+          <span class="window-title">bash — 80×24</span>
+        </div>
+        <div class="terminal-canvas">
+          <div class="output-lines">
+            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys009</span>
+            <span class="output-line">Fetching https://api.example.com/status</span>
+            <span class="output-line dim">  HTTP/2 200</span>
+            <span class="output-line dim">  content-type: application/json</span>
+            <span class="output-line dim">  x-request-id: a3f9c21e-04b2-4d78</span>
+            <span class="output-line">{</span>
+            <span class="output-line">  "status": "healthy",</span>
+            <span class="output-line">  "version": "2.4.1",</span>
+            <span class="output-line bold">  "uptime": "14d 6h 32m"</span>
+            <span class="output-line">}</span>
+          </div>
+          <div class="input-line">
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+
+      const command = "curl -s api.example.com/status | jq";
+      const typedEl = document.querySelector(".typed-command");
+      const cursorEl = document.querySelector(".cursor-block");
+      const outputLines = document.querySelectorAll(".output-line");
+
+      const tl = gsap.timeline({ paused: true });
+
+      tl.set(typedEl, { text: "" }, 0);
+
+      const charDuration = 1.5 / command.length;
+      command.split("").forEach((char, i) => {
+        tl.add(() => {
+          typedEl.textContent = command.slice(0, i + 1);
+        }, 0.5 + i * charDuration);
+      });
+
+      tl.set(cursorEl, { opacity: 0 }, 2.2);
+      tl.set(outputLines[0], { opacity: 1 }, 2.3);
+
+      tl.add(() => {
+        typedEl.textContent = "";
+      }, 2.5);
+
+      outputLines.forEach((line, i) => {
+        if (i === 0) return;
+        tl.set(line, { opacity: 1 }, 2.8 + i * 0.1);
+      });
+
+      tl.add(() => {
+        const inputLine = document.querySelector(".input-line");
+        const newPrompt = document.createElement("div");
+        newPrompt.className = "input-line";
+        newPrompt.innerHTML =
+          '<span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block" id="final-cursor"></span>';
+        inputLine.style.display = "none";
+        inputLine.parentNode.appendChild(newPrompt);
+      }, 4.4);
+
+      const blinkTimes = [4.6, 5.0, 5.4, 5.8, 6.2, 6.6];
+      blinkTimes.forEach((t, i) => {
+        tl.add(() => {
+          const fc = document.getElementById("final-cursor");
+          if (fc) fc.style.opacity = i % 2 === 0 ? "0" : "1";
+        }, t);
+      });
+      tl.add(() => {
+        const fc = document.getElementById("final-cursor");
+        if (fc) fc.style.opacity = "1";
+      }, 7.0);
+
+      window.__timelines["code-snippet-apple-terminal-red-sands"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json b/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
new file mode 100644
index 000000000..29bd1925e
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "code-snippet-apple-terminal-red-sands",
+  "type": "hyperframes:block",
+  "title": "Code Snippet - Apple Terminal Red Sands",
+  "description": "Apple Terminal Red Sands profile: deep red background with sandy text, per-character typing animation of a shell session.",
+  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 12,
+  "files": [
+    {
+      "path": "code-snippet-apple-terminal-red-sands.html",
+      "target": "compositions/code-snippet-apple-terminal-red-sands.html",
+      "type": "hyperframes:composition"
+    }
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-red-sands.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-red-sands.png"
+  }
+}
diff --git a/registry/blocks/code-snippet-apple-terminal-silver-aerogel/code-snippet-apple-terminal-silver-aerogel.html b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/code-snippet-apple-terminal-silver-aerogel.html
new file mode 100644
index 000000000..c3de23dd2
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/code-snippet-apple-terminal-silver-aerogel.html
@@ -0,0 +1,246 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=1920, height=1080" />
+    <title>Apple Terminal Silver Aerogel</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        background: #2a2a2a;
+        font-family: "SF Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      #scene {
+        width: 1920px;
+        height: 1080px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: radial-gradient(ellipse at center, #3a3a3a 0%, #1c1c1c 100%);
+      }
+
+      .terminal-window {
+        width: 1400px;
+        height: 700px;
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow:
+          0 30px 80px rgba(0, 0, 0, 0.6),
+          0 10px 30px rgba(232, 232, 232, 0.05);
+        display: flex;
+        flex-direction: column;
+      }
+
+      .titlebar {
+        height: 38px;
+        background: #2a2a2a;
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        flex-shrink: 0;
+        border-bottom: 1px solid #444444;
+        position: relative;
+      }
+
+      .traffic-lights {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .traffic-lights span {
+        width: 13px;
+        height: 13px;
+        border-radius: 50%;
+        display: inline-block;
+      }
+
+      .traffic-lights .close {
+        background: #ff5f57;
+        border: 1px solid #e0443e;
+      }
+
+      .traffic-lights .minimize {
+        background: #ffbd2e;
+        border: 1px solid #dfa123;
+      }
+
+      .traffic-lights .fullscreen {
+        background: #28c840;
+        border: 1px solid #1aab29;
+      }
+
+      .window-title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-size: 13px;
+        color: #ffffff;
+        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
+        font-weight: 500;
+        letter-spacing: -0.1px;
+      }
+
+      .terminal-canvas {
+        flex: 1;
+        background: #3d3d3d;
+        padding: 18px 20px;
+        overflow: hidden;
+        font-size: 14px;
+        line-height: 1.6;
+        color: #ffffff;
+      }
+
+      .output-lines {
+        margin-bottom: 4px;
+      }
+
+      .output-line {
+        display: block;
+        white-space: pre;
+        opacity: 0;
+        color: #ffffff;
+      }
+
+      .output-line.bold {
+        font-weight: bold;
+        color: #ffffff;
+      }
+
+      .output-line.dim {
+        color: #aaaaaa;
+      }
+
+      .output-line.success {
+        color: #7fffb3;
+      }
+
+      .output-line.warn {
+        color: #ffd700;
+      }
+
+      .input-line {
+        display: flex;
+        align-items: center;
+        white-space: pre;
+      }
+
+      .prompt {
+        color: #e8e8e8;
+        font-weight: bold;
+        user-select: none;
+      }
+
+      .typed-command {
+        color: #ffffff;
+      }
+
+      .cursor-block {
+        display: inline-block;
+        width: 9px;
+        height: 16px;
+        background: #e8e8e8;
+        vertical-align: text-bottom;
+        margin-left: 1px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="scene"
+      data-composition-id="code-snippet-apple-terminal-silver-aerogel"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div class="terminal-window">
+        <div class="titlebar">
+          <div class="traffic-lights">
+            <span class="close"></span>
+            <span class="minimize"></span>
+            <span class="fullscreen"></span>
+          </div>
+          <span class="window-title">bash — 80×24</span>
+        </div>
+        <div class="terminal-canvas">
+          <div class="output-lines">
+            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys010</span>
+            <span class="output-line">Checking system resources...</span>
+            <span class="output-line">Filesystem          Size    Used   Avail  Use%</span>
+            <span class="output-line">/dev/disk3s1s1     460G    142G    302G   32%</span>
+            <span class="output-line dim">/dev/disk3s6       460G    5.0G    302G    2%</span>
+            <span class="output-line">/dev/disk3s2       460G     11G    302G    4%</span>
+            <span class="output-line warn">Memory: 14.2 GB / 16.0 GB used (89%)</span>
+            <span class="output-line success">CPU: 8-core, 12% load average</span>
+          </div>
+          <div class="input-line">
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+
+      const command = "df -h && vm_stat";
+      const typedEl = document.querySelector(".typed-command");
+      const cursorEl = document.querySelector(".cursor-block");
+      const outputLines = document.querySelectorAll(".output-line");
+
+      const tl = gsap.timeline({ paused: true });
+
+      tl.set(typedEl, { text: "" }, 0);
+
+      const charDuration = 1.5 / command.length;
+      command.split("").forEach((char, i) => {
+        tl.add(() => {
+          typedEl.textContent = command.slice(0, i + 1);
+        }, 0.5 + i * charDuration);
+      });
+
+      tl.set(cursorEl, { opacity: 0 }, 2.2);
+      tl.set(outputLines[0], { opacity: 1 }, 2.3);
+
+      tl.add(() => {
+        typedEl.textContent = "";
+      }, 2.5);
+
+      outputLines.forEach((line, i) => {
+        if (i === 0) return;
+        tl.set(line, { opacity: 1 }, 2.8 + i * 0.1);
+      });
+
+      tl.add(() => {
+        const inputLine = document.querySelector(".input-line");
+        const newPrompt = document.createElement("div");
+        newPrompt.className = "input-line";
+        newPrompt.innerHTML =
+          '<span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block" id="final-cursor"></span>';
+        inputLine.style.display = "none";
+        inputLine.parentNode.appendChild(newPrompt);
+      }, 4.2);
+
+      const blinkTimes = [4.4, 4.8, 5.2, 5.6, 6.0, 6.4];
+      blinkTimes.forEach((t, i) => {
+        tl.add(() => {
+          const fc = document.getElementById("final-cursor");
+          if (fc) fc.style.opacity = i % 2 === 0 ? "0" : "1";
+        }, t);
+      });
+      tl.add(() => {
+        const fc = document.getElementById("final-cursor");
+        if (fc) fc.style.opacity = "1";
+      }, 6.8);
+
+      window.__timelines["code-snippet-apple-terminal-silver-aerogel"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
new file mode 100644
index 000000000..f7859829f
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "code-snippet-apple-terminal-silver-aerogel",
+  "type": "hyperframes:block",
+  "title": "Code Snippet - Apple Terminal Silver Aerogel",
+  "description": "Apple Terminal Silver Aerogel profile: dark grey background with white text, per-character typing animation of a shell session.",
+  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 12,
+  "files": [
+    {
+      "path": "code-snippet-apple-terminal-silver-aerogel.html",
+      "target": "compositions/code-snippet-apple-terminal-silver-aerogel.html",
+      "type": "hyperframes:composition"
+    }
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.png"
+  }
+}
diff --git a/registry/blocks/code-snippet-apple-terminal-solid-colors/code-snippet-apple-terminal-solid-colors.html b/registry/blocks/code-snippet-apple-terminal-solid-colors/code-snippet-apple-terminal-solid-colors.html
new file mode 100644
index 000000000..55cc6a4c6
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-solid-colors/code-snippet-apple-terminal-solid-colors.html
@@ -0,0 +1,243 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=1920, height=1080" />
+    <title>Apple Terminal Solid Colors</title>
+    <style>
+      html,
+      body {
+        margin: 0;
+        padding: 0;
+        width: 1920px;
+        height: 1080px;
+        overflow: hidden;
+        background: #4c0099;
+        font-family: "SF Mono", Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      #scene {
+        width: 1920px;
+        height: 1080px;
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background: radial-gradient(ellipse at center, #5a00b3 0%, #2e0060 100%);
+      }
+
+      .terminal-window {
+        width: 1400px;
+        height: 700px;
+        border-radius: 10px;
+        overflow: hidden;
+        box-shadow:
+          0 30px 80px rgba(0, 0, 0, 0.7),
+          0 10px 30px rgba(76, 0, 153, 0.4);
+        display: flex;
+        flex-direction: column;
+      }
+
+      .titlebar {
+        height: 38px;
+        background: #3a0077;
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        flex-shrink: 0;
+        border-bottom: 1px solid #6600bb;
+        position: relative;
+      }
+
+      .traffic-lights {
+        display: flex;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .traffic-lights span {
+        width: 13px;
+        height: 13px;
+        border-radius: 50%;
+        display: inline-block;
+      }
+
+      .traffic-lights .close {
+        background: #ff5f57;
+        border: 1px solid #e0443e;
+      }
+
+      .traffic-lights .minimize {
+        background: #ffbd2e;
+        border: 1px solid #dfa123;
+      }
+
+      .traffic-lights .fullscreen {
+        background: #28c840;
+        border: 1px solid #1aab29;
+      }
+
+      .window-title {
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        font-size: 13px;
+        color: #ffffff;
+        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
+        font-weight: 500;
+        letter-spacing: -0.1px;
+      }
+
+      .terminal-canvas {
+        flex: 1;
+        background: #4c0099;
+        padding: 18px 20px;
+        overflow: hidden;
+        font-size: 14px;
+        line-height: 1.6;
+        color: #ffffff;
+      }
+
+      .output-lines {
+        margin-bottom: 4px;
+      }
+
+      .output-line {
+        display: block;
+        white-space: pre;
+        opacity: 0;
+        color: #ffffff;
+      }
+
+      .output-line.bold {
+        font-weight: bold;
+        color: #ffffff;
+      }
+
+      .output-line.dim {
+        color: rgba(255, 255, 255, 0.55);
+      }
+
+      .output-line.accent {
+        color: #cc99ff;
+        font-weight: bold;
+      }
+
+      .input-line {
+        display: flex;
+        align-items: center;
+        white-space: pre;
+      }
+
+      .prompt {
+        color: #cc99ff;
+        font-weight: bold;
+        user-select: none;
+      }
+
+      .typed-command {
+        color: #ffffff;
+      }
+
+      .cursor-block {
+        display: inline-block;
+        width: 9px;
+        height: 16px;
+        background: #ffffff;
+        vertical-align: text-bottom;
+        margin-left: 1px;
+      }
+    </style>
+  </head>
+  <body>
+    <div
+      id="scene"
+      data-composition-id="code-snippet-apple-terminal-solid-colors"
+      data-width="1920"
+      data-height="1080"
+    >
+      <div class="terminal-window">
+        <div class="titlebar">
+          <div class="traffic-lights">
+            <span class="close"></span>
+            <span class="minimize"></span>
+            <span class="fullscreen"></span>
+          </div>
+          <span class="window-title">bash — 80×24</span>
+        </div>
+        <div class="terminal-canvas">
+          <div class="output-lines">
+            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys011</span>
+            <span class="output-line">Initializing HyperFrames project...</span>
+            <span class="output-line dim">  Creating project structure</span>
+            <span class="output-line dim">  Copying template files</span>
+            <span class="output-line dim">  Installing dependencies</span>
+            <span class="output-line">  added 142 packages in 3.4s</span>
+            <span class="output-line accent">  ✓ Project ready at ./my-video</span>
+            <span class="output-line bold">  Run: cd my-video && npx hyperframes preview</span>
+          </div>
+          <div class="input-line">
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
+    <script>
+      window.__timelines = window.__timelines || {};
+
+      const command = "npx hyperframes init my-video";
+      const typedEl = document.querySelector(".typed-command");
+      const cursorEl = document.querySelector(".cursor-block");
+      const outputLines = document.querySelectorAll(".output-line");
+
+      const tl = gsap.timeline({ paused: true });
+
+      tl.set(typedEl, { text: "" }, 0);
+
+      const charDuration = 1.5 / command.length;
+      command.split("").forEach((char, i) => {
+        tl.add(() => {
+          typedEl.textContent = command.slice(0, i + 1);
+        }, 0.5 + i * charDuration);
+      });
+
+      tl.set(cursorEl, { opacity: 0 }, 2.2);
+      tl.set(outputLines[0], { opacity: 1 }, 2.3);
+
+      tl.add(() => {
+        typedEl.textContent = "";
+      }, 2.5);
+
+      outputLines.forEach((line, i) => {
+        if (i === 0) return;
+        tl.set(line, { opacity: 1 }, 2.8 + i * 0.1);
+      });
+
+      tl.add(() => {
+        const inputLine = document.querySelector(".input-line");
+        const newPrompt = document.createElement("div");
+        newPrompt.className = "input-line";
+        newPrompt.innerHTML =
+          '<span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block" id="final-cursor"></span>';
+        inputLine.style.display = "none";
+        inputLine.parentNode.appendChild(newPrompt);
+      }, 4.2);
+
+      const blinkTimes = [4.4, 4.8, 5.2, 5.6, 6.0, 6.4];
+      blinkTimes.forEach((t, i) => {
+        tl.add(() => {
+          const fc = document.getElementById("final-cursor");
+          if (fc) fc.style.opacity = i % 2 === 0 ? "0" : "1";
+        }, t);
+      });
+      tl.add(() => {
+        const fc = document.getElementById("final-cursor");
+        if (fc) fc.style.opacity = "1";
+      }, 6.8);
+
+      window.__timelines["code-snippet-apple-terminal-solid-colors"] = tl;
+    </script>
+  </body>
+</html>
diff --git a/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json b/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
new file mode 100644
index 000000000..f55d2e425
--- /dev/null
+++ b/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
@@ -0,0 +1,24 @@
+{
+  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
+  "name": "code-snippet-apple-terminal-solid-colors",
+  "type": "hyperframes:block",
+  "title": "Code Snippet - Apple Terminal Solid Colors",
+  "description": "Apple Terminal Solid Colors profile: deep purple background with white text, per-character typing animation of a shell session.",
+  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "dimensions": {
+    "width": 1920,
+    "height": 1080
+  },
+  "duration": 12,
+  "files": [
+    {
+      "path": "code-snippet-apple-terminal-solid-colors.html",
+      "target": "compositions/code-snippet-apple-terminal-solid-colors.html",
+      "type": "hyperframes:composition"
+    }
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-solid-colors.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-solid-colors.png"
+  }
+}

From 13f730a85225be792db11d4cc311fb4cab7e1a2b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Miguel=20=C3=81ngel?= <miguel.sierra@heygen.com>
Date: Tue, 2 Jun 2026 15:58:33 +0000
Subject: [PATCH 2/5] fix(registry): remove placeholder preview URLs for
 unrendered Apple Terminal themes

The 8 themes without rendered videos (clear-dark, homebrew, novel,
ocean, pro, red-sands, silver-aerogel, solid-colors) had preview.video
URLs pointing to non-existent S3 objects, returning 403. Removed the
preview field from their registry-item.json and the video embed from
their MDX pages until renders are available.

The 4 themes with uploaded videos (basic, clear-light, grass, man-page)
retain their preview URLs and are live on CDN.
---
 .../code-snippet-apple-terminal-clear-dark.mdx     |  1 -
 .../code-snippet-apple-terminal-homebrew.mdx       |  1 -
 .../blocks/code-snippet-apple-terminal-novel.mdx   |  1 -
 .../blocks/code-snippet-apple-terminal-ocean.mdx   |  1 -
 .../blocks/code-snippet-apple-terminal-pro.mdx     |  1 -
 .../code-snippet-apple-terminal-red-sands.mdx      |  1 -
 .../code-snippet-apple-terminal-silver-aerogel.mdx |  1 -
 .../code-snippet-apple-terminal-solid-colors.mdx   |  1 -
 .../registry-item.json                             | 14 ++++++++------
 .../registry-item.json                             | 14 ++++++++------
 .../registry-item.json                             | 14 ++++++++------
 .../registry-item.json                             | 14 ++++++++------
 .../registry-item.json                             | 14 ++++++++------
 .../registry-item.json                             | 14 ++++++++------
 .../registry-item.json                             | 14 ++++++++------
 .../registry-item.json                             | 14 ++++++++------
 16 files changed, 64 insertions(+), 56 deletions(-)

diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-clear-dark.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-clear-dark.mdx
index 121cdabde..07994aeab 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-clear-dark.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-clear-dark.mdx
@@ -9,7 +9,6 @@ macOS Terminal.app window in the built-in Clear Dark profile — translucent bla
 
 `code` `developer` `showcase` `terminal` `apple`
 
-<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-dark.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-dark.png" autoPlay muted loop playsInline />
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-homebrew.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-homebrew.mdx
index ce29245d3..92a8239b0 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-homebrew.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-homebrew.mdx
@@ -9,7 +9,6 @@ macOS Terminal.app window in the built-in Homebrew profile — black background
 
 `code` `developer` `showcase` `terminal` `apple`
 
-<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-homebrew.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-homebrew.png" autoPlay muted loop playsInline />
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx
index 9f6cd776c..2015f2eb2 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx
@@ -9,7 +9,6 @@ macOS Terminal.app window in the built-in Novel profile — warm parchment `#DFC
 
 `code` `developer` `showcase` `terminal` `apple`
 
-<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-novel.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-novel.png" autoPlay muted loop playsInline />
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx
index a46b68c0e..d233dc0f0 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx
@@ -9,7 +9,6 @@ macOS Terminal.app window in the built-in Ocean profile — vivid `#224FBE` blue
 
 `code` `developer` `showcase` `terminal` `apple`
 
-<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-ocean.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-ocean.png" autoPlay muted loop playsInline />
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx
index f9d3d5ee6..a16fc8ee5 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx
@@ -9,7 +9,6 @@ macOS Terminal.app window in the built-in Pro profile — pure black background
 
 `code` `developer` `showcase` `terminal` `apple`
 
-<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-pro.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-pro.png" autoPlay muted loop playsInline />
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-red-sands.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-red-sands.mdx
index 2b97c025f..b4708aed9 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-red-sands.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-red-sands.mdx
@@ -9,7 +9,6 @@ macOS Terminal.app window in the built-in Red Sands profile — deep crimson `#7
 
 `code` `developer` `showcase` `terminal` `apple`
 
-<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-red-sands.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-red-sands.png" autoPlay muted loop playsInline />
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mdx
index 82bd77750..08948552c 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mdx
@@ -9,7 +9,6 @@ macOS Terminal.app window in the built-in Silver Aerogel profile — dark grey `
 
 `code` `developer` `showcase` `terminal` `apple`
 
-<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.png" autoPlay muted loop playsInline />
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-solid-colors.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-solid-colors.mdx
index 48386ba60..962d6c4b6 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-solid-colors.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-solid-colors.mdx
@@ -9,7 +9,6 @@ macOS Terminal.app window in the built-in Solid Colors profile — vivid deep pu
 
 `code` `developer` `showcase` `terminal` `apple`
 
-<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-solid-colors.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-solid-colors.png" autoPlay muted loop playsInline />
 
 ## Install
 
diff --git a/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json b/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
index c2c3813d1..186757920 100644
--- a/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
@@ -4,7 +4,13 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Clear Dark",
   "description": "Apple Terminal Clear Dark profile: semi-transparent dark background, per-character typing animation of a shell session.",
-  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "tags": [
+    "code",
+    "developer",
+    "showcase",
+    "terminal",
+    "apple"
+  ],
   "dimensions": {
     "width": 1920,
     "height": 1080
@@ -16,9 +22,5 @@
       "target": "compositions/code-snippet-apple-terminal-clear-dark.html",
       "type": "hyperframes:composition"
     }
-  ],
-  "preview": {
-    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-dark.mp4",
-    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-dark.png"
-  }
+  ]
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json b/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
index 67cfb0017..6e7708169 100644
--- a/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
@@ -4,7 +4,13 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Homebrew",
   "description": "Apple Terminal Homebrew profile: black background with bright green text and lime cursor, per-character typing animation of a shell session.",
-  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "tags": [
+    "code",
+    "developer",
+    "showcase",
+    "terminal",
+    "apple"
+  ],
   "dimensions": {
     "width": 1920,
     "height": 1080
@@ -16,9 +22,5 @@
       "target": "compositions/code-snippet-apple-terminal-homebrew.html",
       "type": "hyperframes:composition"
     }
-  ],
-  "preview": {
-    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-homebrew.mp4",
-    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-homebrew.png"
-  }
+  ]
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json b/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
index 007526692..74853f728 100644
--- a/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
@@ -4,7 +4,13 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Novel",
   "description": "Apple Terminal Novel profile: warm parchment background with dark brown text, per-character typing animation of a shell session.",
-  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "tags": [
+    "code",
+    "developer",
+    "showcase",
+    "terminal",
+    "apple"
+  ],
   "dimensions": {
     "width": 1920,
     "height": 1080
@@ -16,9 +22,5 @@
       "target": "compositions/code-snippet-apple-terminal-novel.html",
       "type": "hyperframes:composition"
     }
-  ],
-  "preview": {
-    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-novel.mp4",
-    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-novel.png"
-  }
+  ]
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json b/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
index d280f3768..f8989fae7 100644
--- a/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
@@ -4,7 +4,13 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Ocean",
   "description": "Apple Terminal Ocean profile: deep blue background with white text, per-character typing animation of a shell session.",
-  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "tags": [
+    "code",
+    "developer",
+    "showcase",
+    "terminal",
+    "apple"
+  ],
   "dimensions": {
     "width": 1920,
     "height": 1080
@@ -16,9 +22,5 @@
       "target": "compositions/code-snippet-apple-terminal-ocean.html",
       "type": "hyperframes:composition"
     }
-  ],
-  "preview": {
-    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-ocean.mp4",
-    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-ocean.png"
-  }
+  ]
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json b/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
index b54f8b885..2e2436a7d 100644
--- a/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
@@ -4,7 +4,13 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Pro",
   "description": "Apple Terminal Pro profile: black background with grey text and lime green cursor, per-character typing animation of a shell session.",
-  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "tags": [
+    "code",
+    "developer",
+    "showcase",
+    "terminal",
+    "apple"
+  ],
   "dimensions": {
     "width": 1920,
     "height": 1080
@@ -16,9 +22,5 @@
       "target": "compositions/code-snippet-apple-terminal-pro.html",
       "type": "hyperframes:composition"
     }
-  ],
-  "preview": {
-    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-pro.mp4",
-    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-pro.png"
-  }
+  ]
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json b/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
index 29bd1925e..f1bdd6ac3 100644
--- a/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
@@ -4,7 +4,13 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Red Sands",
   "description": "Apple Terminal Red Sands profile: deep red background with sandy text, per-character typing animation of a shell session.",
-  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "tags": [
+    "code",
+    "developer",
+    "showcase",
+    "terminal",
+    "apple"
+  ],
   "dimensions": {
     "width": 1920,
     "height": 1080
@@ -16,9 +22,5 @@
       "target": "compositions/code-snippet-apple-terminal-red-sands.html",
       "type": "hyperframes:composition"
     }
-  ],
-  "preview": {
-    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-red-sands.mp4",
-    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-red-sands.png"
-  }
+  ]
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
index f7859829f..111b81974 100644
--- a/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
@@ -4,7 +4,13 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Silver Aerogel",
   "description": "Apple Terminal Silver Aerogel profile: dark grey background with white text, per-character typing animation of a shell session.",
-  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "tags": [
+    "code",
+    "developer",
+    "showcase",
+    "terminal",
+    "apple"
+  ],
   "dimensions": {
     "width": 1920,
     "height": 1080
@@ -16,9 +22,5 @@
       "target": "compositions/code-snippet-apple-terminal-silver-aerogel.html",
       "type": "hyperframes:composition"
     }
-  ],
-  "preview": {
-    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mp4",
-    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.png"
-  }
+  ]
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json b/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
index f55d2e425..c6afa2ca5 100644
--- a/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
@@ -4,7 +4,13 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Solid Colors",
   "description": "Apple Terminal Solid Colors profile: deep purple background with white text, per-character typing animation of a shell session.",
-  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "tags": [
+    "code",
+    "developer",
+    "showcase",
+    "terminal",
+    "apple"
+  ],
   "dimensions": {
     "width": 1920,
     "height": 1080
@@ -16,9 +22,5 @@
       "target": "compositions/code-snippet-apple-terminal-solid-colors.html",
       "type": "hyperframes:composition"
     }
-  ],
-  "preview": {
-    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-solid-colors.mp4",
-    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-solid-colors.png"
-  }
+  ]
 }

From 4befaf74551c5dc076f306074ab2aec2c63c8ac7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Miguel=20=C3=81ngel?= <miguel.sierra@heygen.com>
Date: Tue, 2 Jun 2026 16:00:30 +0000
Subject: [PATCH 3/5] fix(registry): add apple-terminal tag so npx hyperframes
 add apple-terminal works

---
 .../code-snippet-apple-terminal-basic/registry-item.json | 9 ++++++++-
 .../registry-item.json                                   | 3 ++-
 .../registry-item.json                                   | 9 ++++++++-
 .../code-snippet-apple-terminal-grass/registry-item.json | 9 ++++++++-
 .../registry-item.json                                   | 3 ++-
 .../registry-item.json                                   | 9 ++++++++-
 .../code-snippet-apple-terminal-novel/registry-item.json | 3 ++-
 .../code-snippet-apple-terminal-ocean/registry-item.json | 3 ++-
 .../code-snippet-apple-terminal-pro/registry-item.json   | 3 ++-
 .../registry-item.json                                   | 3 ++-
 .../registry-item.json                                   | 3 ++-
 .../registry-item.json                                   | 3 ++-
 12 files changed, 48 insertions(+), 12 deletions(-)

diff --git a/registry/blocks/code-snippet-apple-terminal-basic/registry-item.json b/registry/blocks/code-snippet-apple-terminal-basic/registry-item.json
index ca2cce162..f6243a21d 100644
--- a/registry/blocks/code-snippet-apple-terminal-basic/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-basic/registry-item.json
@@ -4,7 +4,14 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Basic",
   "description": "Apple Terminal Basic profile: white background, black text, per-character typing animation of a shell session.",
-  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "tags": [
+    "code",
+    "developer",
+    "showcase",
+    "terminal",
+    "apple",
+    "apple-terminal"
+  ],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json b/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
index 186757920..2e7abbca8 100644
--- a/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
@@ -9,7 +9,8 @@
     "developer",
     "showcase",
     "terminal",
-    "apple"
+    "apple",
+    "apple-terminal"
   ],
   "dimensions": {
     "width": 1920,
diff --git a/registry/blocks/code-snippet-apple-terminal-clear-light/registry-item.json b/registry/blocks/code-snippet-apple-terminal-clear-light/registry-item.json
index 0e0c379de..dc2850099 100644
--- a/registry/blocks/code-snippet-apple-terminal-clear-light/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-clear-light/registry-item.json
@@ -4,7 +4,14 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Clear Light",
   "description": "Apple Terminal Clear Light profile: semi-transparent light background, per-character typing animation of a shell session.",
-  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "tags": [
+    "code",
+    "developer",
+    "showcase",
+    "terminal",
+    "apple",
+    "apple-terminal"
+  ],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-grass/registry-item.json b/registry/blocks/code-snippet-apple-terminal-grass/registry-item.json
index d1fc5f38e..f87d10f07 100644
--- a/registry/blocks/code-snippet-apple-terminal-grass/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-grass/registry-item.json
@@ -4,7 +4,14 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Grass",
   "description": "Apple Terminal Grass profile: black background with green text, per-character typing animation of a shell session.",
-  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "tags": [
+    "code",
+    "developer",
+    "showcase",
+    "terminal",
+    "apple",
+    "apple-terminal"
+  ],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json b/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
index 6e7708169..5a6914503 100644
--- a/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
@@ -9,7 +9,8 @@
     "developer",
     "showcase",
     "terminal",
-    "apple"
+    "apple",
+    "apple-terminal"
   ],
   "dimensions": {
     "width": 1920,
diff --git a/registry/blocks/code-snippet-apple-terminal-man-page/registry-item.json b/registry/blocks/code-snippet-apple-terminal-man-page/registry-item.json
index 8d5b262bb..8a526fa55 100644
--- a/registry/blocks/code-snippet-apple-terminal-man-page/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-man-page/registry-item.json
@@ -4,7 +4,14 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Man Page",
   "description": "Apple Terminal Man Page profile: pale yellow background with black text, per-character typing animation of a shell session.",
-  "tags": ["code", "developer", "showcase", "terminal", "apple"],
+  "tags": [
+    "code",
+    "developer",
+    "showcase",
+    "terminal",
+    "apple",
+    "apple-terminal"
+  ],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json b/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
index 74853f728..13f2c6f96 100644
--- a/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
@@ -9,7 +9,8 @@
     "developer",
     "showcase",
     "terminal",
-    "apple"
+    "apple",
+    "apple-terminal"
   ],
   "dimensions": {
     "width": 1920,
diff --git a/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json b/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
index f8989fae7..876bcf87b 100644
--- a/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
@@ -9,7 +9,8 @@
     "developer",
     "showcase",
     "terminal",
-    "apple"
+    "apple",
+    "apple-terminal"
   ],
   "dimensions": {
     "width": 1920,
diff --git a/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json b/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
index 2e2436a7d..7bce8fe2b 100644
--- a/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
@@ -9,7 +9,8 @@
     "developer",
     "showcase",
     "terminal",
-    "apple"
+    "apple",
+    "apple-terminal"
   ],
   "dimensions": {
     "width": 1920,
diff --git a/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json b/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
index f1bdd6ac3..9ae336983 100644
--- a/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
@@ -9,7 +9,8 @@
     "developer",
     "showcase",
     "terminal",
-    "apple"
+    "apple",
+    "apple-terminal"
   ],
   "dimensions": {
     "width": 1920,
diff --git a/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
index 111b81974..015620687 100644
--- a/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
@@ -9,7 +9,8 @@
     "developer",
     "showcase",
     "terminal",
-    "apple"
+    "apple",
+    "apple-terminal"
   ],
   "dimensions": {
     "width": 1920,
diff --git a/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json b/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
index c6afa2ca5..2fd0e186e 100644
--- a/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
@@ -9,7 +9,8 @@
     "developer",
     "showcase",
     "terminal",
-    "apple"
+    "apple",
+    "apple-terminal"
   ],
   "dimensions": {
     "width": 1920,

From 1c7c5f36a6575c0ef9366a1f8c2734bc2aac788c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Miguel=20=C3=81ngel?= <miguel.sierra@heygen.com>
Date: Tue, 2 Jun 2026 16:02:41 +0000
Subject: [PATCH 4/5] feat(registry): render + upload all 12 Apple Terminal
 preview videos to CDN

Rendered the 8 missing themes (clear-dark, homebrew, novel, ocean, pro,
red-sands, silver-aerogel, solid-colors) using npx hyperframes@latest
render and uploaded to the hyperframes CDN. All 12 themes now have
live preview.video URLs and video embeds in their MDX pages.

All 12 CDN URLs return 200.
---
 .../blocks/code-snippet-apple-terminal-clear-dark.mdx       | 2 ++
 .../catalog/blocks/code-snippet-apple-terminal-homebrew.mdx | 2 ++
 docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx   | 2 ++
 docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx   | 2 ++
 docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx     | 2 ++
 .../blocks/code-snippet-apple-terminal-red-sands.mdx        | 2 ++
 .../blocks/code-snippet-apple-terminal-silver-aerogel.mdx   | 2 ++
 .../blocks/code-snippet-apple-terminal-solid-colors.mdx     | 2 ++
 .../registry-item.json                                      | 6 +++++-
 .../code-snippet-apple-terminal-homebrew/registry-item.json | 6 +++++-
 .../code-snippet-apple-terminal-novel/registry-item.json    | 6 +++++-
 .../code-snippet-apple-terminal-ocean/registry-item.json    | 6 +++++-
 .../code-snippet-apple-terminal-pro/registry-item.json      | 6 +++++-
 .../registry-item.json                                      | 6 +++++-
 .../registry-item.json                                      | 6 +++++-
 .../registry-item.json                                      | 6 +++++-
 16 files changed, 56 insertions(+), 8 deletions(-)

diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-clear-dark.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-clear-dark.mdx
index 07994aeab..98e7eaf68 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-clear-dark.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-clear-dark.mdx
@@ -9,6 +9,8 @@ macOS Terminal.app window in the built-in Clear Dark profile — translucent bla
 
 `code` `developer` `showcase` `terminal` `apple`
 
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-dark.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-dark.png" autoPlay muted loop playsInline />
+
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-homebrew.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-homebrew.mdx
index 92a8239b0..f9c3340a9 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-homebrew.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-homebrew.mdx
@@ -9,6 +9,8 @@ macOS Terminal.app window in the built-in Homebrew profile — black background
 
 `code` `developer` `showcase` `terminal` `apple`
 
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-homebrew.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-homebrew.png" autoPlay muted loop playsInline />
+
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx
index 2015f2eb2..9a7a0adba 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-novel.mdx
@@ -9,6 +9,8 @@ macOS Terminal.app window in the built-in Novel profile — warm parchment `#DFC
 
 `code` `developer` `showcase` `terminal` `apple`
 
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-novel.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-novel.png" autoPlay muted loop playsInline />
+
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx
index d233dc0f0..d519bd4c9 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-ocean.mdx
@@ -9,6 +9,8 @@ macOS Terminal.app window in the built-in Ocean profile — vivid `#224FBE` blue
 
 `code` `developer` `showcase` `terminal` `apple`
 
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-ocean.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-ocean.png" autoPlay muted loop playsInline />
+
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx
index a16fc8ee5..e8441e6c5 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-pro.mdx
@@ -9,6 +9,8 @@ macOS Terminal.app window in the built-in Pro profile — pure black background
 
 `code` `developer` `showcase` `terminal` `apple`
 
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-pro.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-pro.png" autoPlay muted loop playsInline />
+
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-red-sands.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-red-sands.mdx
index b4708aed9..c740c6e29 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-red-sands.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-red-sands.mdx
@@ -9,6 +9,8 @@ macOS Terminal.app window in the built-in Red Sands profile — deep crimson `#7
 
 `code` `developer` `showcase` `terminal` `apple`
 
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-red-sands.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-red-sands.png" autoPlay muted loop playsInline />
+
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mdx
index 08948552c..810f2f670 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mdx
@@ -9,6 +9,8 @@ macOS Terminal.app window in the built-in Silver Aerogel profile — dark grey `
 
 `code` `developer` `showcase` `terminal` `apple`
 
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.png" autoPlay muted loop playsInline />
+
 
 ## Install
 
diff --git a/docs/catalog/blocks/code-snippet-apple-terminal-solid-colors.mdx b/docs/catalog/blocks/code-snippet-apple-terminal-solid-colors.mdx
index 962d6c4b6..30b81485c 100644
--- a/docs/catalog/blocks/code-snippet-apple-terminal-solid-colors.mdx
+++ b/docs/catalog/blocks/code-snippet-apple-terminal-solid-colors.mdx
@@ -9,6 +9,8 @@ macOS Terminal.app window in the built-in Solid Colors profile — vivid deep pu
 
 `code` `developer` `showcase` `terminal` `apple`
 
+<video className="w-full aspect-video rounded-xl object-cover bg-zinc-100 dark:bg-zinc-800" src="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-solid-colors.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-solid-colors.png" autoPlay muted loop playsInline />
+
 
 ## Install
 
diff --git a/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json b/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
index 2e7abbca8..d65d0d8e6 100644
--- a/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
@@ -23,5 +23,9 @@
       "target": "compositions/code-snippet-apple-terminal-clear-dark.html",
       "type": "hyperframes:composition"
     }
-  ]
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-dark.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-clear-dark.png"
+  }
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json b/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
index 5a6914503..5b3a34208 100644
--- a/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
@@ -23,5 +23,9 @@
       "target": "compositions/code-snippet-apple-terminal-homebrew.html",
       "type": "hyperframes:composition"
     }
-  ]
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-homebrew.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-homebrew.png"
+  }
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json b/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
index 13f2c6f96..47486d284 100644
--- a/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
@@ -23,5 +23,9 @@
       "target": "compositions/code-snippet-apple-terminal-novel.html",
       "type": "hyperframes:composition"
     }
-  ]
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-novel.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-novel.png"
+  }
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json b/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
index 876bcf87b..f38e77281 100644
--- a/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
@@ -23,5 +23,9 @@
       "target": "compositions/code-snippet-apple-terminal-ocean.html",
       "type": "hyperframes:composition"
     }
-  ]
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-ocean.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-ocean.png"
+  }
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json b/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
index 7bce8fe2b..7b8ec472c 100644
--- a/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
@@ -23,5 +23,9 @@
       "target": "compositions/code-snippet-apple-terminal-pro.html",
       "type": "hyperframes:composition"
     }
-  ]
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-pro.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-pro.png"
+  }
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json b/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
index 9ae336983..f2baaae03 100644
--- a/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
@@ -23,5 +23,9 @@
       "target": "compositions/code-snippet-apple-terminal-red-sands.html",
       "type": "hyperframes:composition"
     }
-  ]
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-red-sands.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-red-sands.png"
+  }
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
index 015620687..674bd5c40 100644
--- a/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
@@ -23,5 +23,9 @@
       "target": "compositions/code-snippet-apple-terminal-silver-aerogel.html",
       "type": "hyperframes:composition"
     }
-  ]
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-silver-aerogel.png"
+  }
 }
diff --git a/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json b/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
index 2fd0e186e..0445f2420 100644
--- a/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
@@ -23,5 +23,9 @@
       "target": "compositions/code-snippet-apple-terminal-solid-colors.html",
       "type": "hyperframes:composition"
     }
-  ]
+  ],
+  "preview": {
+    "video": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-solid-colors.mp4",
+    "poster": "https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-apple-terminal-solid-colors.png"
+  }
 }

From 0d3a4c014bb2ae066ec0525b8063fcae947999d2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Miguel=20=C3=81ngel?= <miguel.sierra@heygen.com>
Date: Tue, 2 Jun 2026 16:07:09 +0000
Subject: [PATCH 5/5] style: format Apple Terminal HTML and JSON files with
 oxfmt

---
 .../code-snippet-apple-terminal-basic.html    | 32 +++++++++++--------
 .../registry-item.json                        |  9 +-----
 ...ode-snippet-apple-terminal-clear-dark.html | 26 ++++++++-------
 .../registry-item.json                        |  9 +-----
 ...de-snippet-apple-terminal-clear-light.html | 14 +++++---
 .../registry-item.json                        |  9 +-----
 .../code-snippet-apple-terminal-grass.html    | 28 +++++++++-------
 .../registry-item.json                        |  9 +-----
 .../code-snippet-apple-terminal-homebrew.html | 14 +++++---
 .../registry-item.json                        |  9 +-----
 .../code-snippet-apple-terminal-man-page.html | 18 +++++++----
 .../registry-item.json                        |  9 +-----
 .../code-snippet-apple-terminal-novel.html    | 18 +++++++----
 .../registry-item.json                        |  9 +-----
 .../code-snippet-apple-terminal-ocean.html    | 28 ++++++++++------
 .../registry-item.json                        |  9 +-----
 .../code-snippet-apple-terminal-pro.html      | 26 ++++++++-------
 .../registry-item.json                        |  9 +-----
 ...code-snippet-apple-terminal-red-sands.html | 26 ++++++++-------
 .../registry-item.json                        |  9 +-----
 ...snippet-apple-terminal-silver-aerogel.html | 22 +++++++------
 .../registry-item.json                        |  9 +-----
 ...e-snippet-apple-terminal-solid-colors.html | 26 ++++++++-------
 .../registry-item.json                        |  9 +-----
 24 files changed, 181 insertions(+), 205 deletions(-)

diff --git a/registry/blocks/code-snippet-apple-terminal-basic/code-snippet-apple-terminal-basic.html b/registry/blocks/code-snippet-apple-terminal-basic/code-snippet-apple-terminal-basic.html
index 691ddbc1e..3d7290423 100644
--- a/registry/blocks/code-snippet-apple-terminal-basic/code-snippet-apple-terminal-basic.html
+++ b/registry/blocks/code-snippet-apple-terminal-basic/code-snippet-apple-terminal-basic.html
@@ -159,19 +159,22 @@
         </div>
         <div class="terminal-canvas">
           <div class="output-lines">
-            <span class="output-line">Last login: Mon Jun  2 09:14:22 on ttys001</span>
+            <span class="output-line">Last login: Mon Jun 2 09:14:22 on ttys001</span>
             <span class="output-line">total 48</span>
-            <span class="output-line bold">drwxr-xr-x   8 user  staff   256 Jun  2 09:10 .</span>
-            <span class="output-line">drwxr-xr-x  42 user  staff  1344 Jun  1 18:22 ..</span>
-            <span class="output-line">-rw-r--r--   1 user  staff   872 May 30 14:05 README.md</span>
-            <span class="output-line bold">drwxr-xr-x   5 user  staff   160 Jun  2 09:10 dist</span>
-            <span class="output-line bold">drwxr-xr-x  12 user  staff   384 Jun  2 09:10 node_modules</span>
-            <span class="output-line">-rw-r--r--   1 user  staff  1204 Jun  2 09:08 package.json</span>
-            <span class="output-line bold">drwxr-xr-x   6 user  staff   192 Jun  2 09:10 src</span>
-            <span class="output-line">-rw-r--r--   1 user  staff   348 May 29 11:42 tsconfig.json</span>
+            <span class="output-line bold">drwxr-xr-x 8 user staff 256 Jun 2 09:10 .</span>
+            <span class="output-line">drwxr-xr-x 42 user staff 1344 Jun 1 18:22 ..</span>
+            <span class="output-line">-rw-r--r-- 1 user staff 872 May 30 14:05 README.md</span>
+            <span class="output-line bold">drwxr-xr-x 5 user staff 160 Jun 2 09:10 dist</span>
+            <span class="output-line bold"
+              >drwxr-xr-x 12 user staff 384 Jun 2 09:10 node_modules</span
+            >
+            <span class="output-line">-rw-r--r-- 1 user staff 1204 Jun 2 09:08 package.json</span>
+            <span class="output-line bold">drwxr-xr-x 6 user staff 192 Jun 2 09:10 src</span>
+            <span class="output-line">-rw-r--r-- 1 user staff 348 May 29 11:42 tsconfig.json</span>
           </div>
           <div class="input-line">
-            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span
+            ><span class="cursor-block"></span>
           </div>
         </div>
       </div>
@@ -194,9 +197,12 @@
       // Phase 2 (0.5–2s): type command char by char
       const charDuration = 1.5 / command.length;
       command.split("").forEach((char, i) => {
-        tl.add(() => {
-          typedEl.textContent = command.slice(0, i + 1);
-        }, 0.5 + i * charDuration);
+        tl.add(
+          () => {
+            typedEl.textContent = command.slice(0, i + 1);
+          },
+          0.5 + i * charDuration,
+        );
       });
 
       // Phase 3 (2.2s): hide cursor, show first output line (login message)
diff --git a/registry/blocks/code-snippet-apple-terminal-basic/registry-item.json b/registry/blocks/code-snippet-apple-terminal-basic/registry-item.json
index f6243a21d..f8b623ee6 100644
--- a/registry/blocks/code-snippet-apple-terminal-basic/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-basic/registry-item.json
@@ -4,14 +4,7 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Basic",
   "description": "Apple Terminal Basic profile: white background, black text, per-character typing animation of a shell session.",
-  "tags": [
-    "code",
-    "developer",
-    "showcase",
-    "terminal",
-    "apple",
-    "apple-terminal"
-  ],
+  "tags": ["code", "developer", "showcase", "terminal", "apple", "apple-terminal"],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-clear-dark/code-snippet-apple-terminal-clear-dark.html b/registry/blocks/code-snippet-apple-terminal-clear-dark/code-snippet-apple-terminal-clear-dark.html
index 6aed8f27b..cb909740f 100644
--- a/registry/blocks/code-snippet-apple-terminal-clear-dark/code-snippet-apple-terminal-clear-dark.html
+++ b/registry/blocks/code-snippet-apple-terminal-clear-dark/code-snippet-apple-terminal-clear-dark.html
@@ -162,19 +162,20 @@
         </div>
         <div class="terminal-canvas">
           <div class="output-lines">
-            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys002</span>
+            <span class="output-line dim">Last login: Mon Jun 2 09:14:22 on ttys002</span>
             <span class="output-line">Scanning dependencies...</span>
             <span class="output-line">Found 3 vulnerabilities (1 moderate, 2 low)</span>
-            <span class="output-line dim">  package: lodash@4.17.20</span>
-            <span class="output-line dim">    severity: moderate</span>
-            <span class="output-line dim">    fix: lodash@4.17.21</span>
-            <span class="output-line dim">  package: minimist@1.2.5</span>
-            <span class="output-line dim">    severity: low</span>
-            <span class="output-line dim">    fix: minimist@1.2.6</span>
+            <span class="output-line dim"> package: lodash@4.17.20</span>
+            <span class="output-line dim"> severity: moderate</span>
+            <span class="output-line dim"> fix: lodash@4.17.21</span>
+            <span class="output-line dim"> package: minimist@1.2.5</span>
+            <span class="output-line dim"> severity: low</span>
+            <span class="output-line dim"> fix: minimist@1.2.6</span>
             <span class="output-line bold">Run `npm audit fix` to fix them.</span>
           </div>
           <div class="input-line">
-            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span
+            ><span class="cursor-block"></span>
           </div>
         </div>
       </div>
@@ -195,9 +196,12 @@
 
       const charDuration = 1.5 / command.length;
       command.split("").forEach((char, i) => {
-        tl.add(() => {
-          typedEl.textContent = command.slice(0, i + 1);
-        }, 0.5 + i * charDuration);
+        tl.add(
+          () => {
+            typedEl.textContent = command.slice(0, i + 1);
+          },
+          0.5 + i * charDuration,
+        );
       });
 
       tl.set(cursorEl, { opacity: 0 }, 2.2);
diff --git a/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json b/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
index d65d0d8e6..5f5e66377 100644
--- a/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-clear-dark/registry-item.json
@@ -4,14 +4,7 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Clear Dark",
   "description": "Apple Terminal Clear Dark profile: semi-transparent dark background, per-character typing animation of a shell session.",
-  "tags": [
-    "code",
-    "developer",
-    "showcase",
-    "terminal",
-    "apple",
-    "apple-terminal"
-  ],
+  "tags": ["code", "developer", "showcase", "terminal", "apple", "apple-terminal"],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-clear-light/code-snippet-apple-terminal-clear-light.html b/registry/blocks/code-snippet-apple-terminal-clear-light/code-snippet-apple-terminal-clear-light.html
index 1a604ab1f..7f3f7769b 100644
--- a/registry/blocks/code-snippet-apple-terminal-clear-light/code-snippet-apple-terminal-clear-light.html
+++ b/registry/blocks/code-snippet-apple-terminal-clear-light/code-snippet-apple-terminal-clear-light.html
@@ -162,7 +162,7 @@
         </div>
         <div class="terminal-canvas">
           <div class="output-lines">
-            <span class="output-line muted">Last login: Mon Jun  2 09:14:22 on ttys003</span>
+            <span class="output-line muted">Last login: Mon Jun 2 09:14:22 on ttys003</span>
             <span class="output-line bold">git log --oneline -8</span>
             <span class="output-line">a3f2c19 fix: correct off-by-one in pagination</span>
             <span class="output-line">b7e8d04 feat: add dark mode toggle</span>
@@ -174,7 +174,8 @@
             <span class="output-line">3c5f012 init: project bootstrap</span>
           </div>
           <div class="input-line">
-            <span class="prompt">user@Mac myproject % </span><span class="typed-command"></span><span class="cursor-block"></span>
+            <span class="prompt">user@Mac myproject % </span><span class="typed-command"></span
+            ><span class="cursor-block"></span>
           </div>
         </div>
       </div>
@@ -195,9 +196,12 @@
 
       const charDuration = 1.5 / command.length;
       command.split("").forEach((char, i) => {
-        tl.add(() => {
-          typedEl.textContent = command.slice(0, i + 1);
-        }, 0.5 + i * charDuration);
+        tl.add(
+          () => {
+            typedEl.textContent = command.slice(0, i + 1);
+          },
+          0.5 + i * charDuration,
+        );
       });
 
       tl.set(cursorEl, { opacity: 0 }, 2.2);
diff --git a/registry/blocks/code-snippet-apple-terminal-clear-light/registry-item.json b/registry/blocks/code-snippet-apple-terminal-clear-light/registry-item.json
index dc2850099..0605c1adb 100644
--- a/registry/blocks/code-snippet-apple-terminal-clear-light/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-clear-light/registry-item.json
@@ -4,14 +4,7 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Clear Light",
   "description": "Apple Terminal Clear Light profile: semi-transparent light background, per-character typing animation of a shell session.",
-  "tags": [
-    "code",
-    "developer",
-    "showcase",
-    "terminal",
-    "apple",
-    "apple-terminal"
-  ],
+  "tags": ["code", "developer", "showcase", "terminal", "apple", "apple-terminal"],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-grass/code-snippet-apple-terminal-grass.html b/registry/blocks/code-snippet-apple-terminal-grass/code-snippet-apple-terminal-grass.html
index 4e8616c64..4556df094 100644
--- a/registry/blocks/code-snippet-apple-terminal-grass/code-snippet-apple-terminal-grass.html
+++ b/registry/blocks/code-snippet-apple-terminal-grass/code-snippet-apple-terminal-grass.html
@@ -162,18 +162,19 @@
         </div>
         <div class="terminal-canvas">
           <div class="output-lines">
-            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys004</span>
+            <span class="output-line dim">Last login: Mon Jun 2 09:14:22 on ttys004</span>
             <span class="output-line">Running test suite...</span>
-            <span class="output-line dim">  ✓ should initialize with defaults (2ms)</span>
-            <span class="output-line dim">  ✓ should parse config correctly (4ms)</span>
-            <span class="output-line dim">  ✓ should handle empty input (1ms)</span>
-            <span class="output-line dim">  ✓ should reject invalid tokens (3ms)</span>
-            <span class="output-line dim">  ✓ should emit events on change (5ms)</span>
-            <span class="output-line dim">  ✓ should clean up on destroy (2ms)</span>
-            <span class="output-line bold">  6 passing (18ms)</span>
+            <span class="output-line dim"> ✓ should initialize with defaults (2ms)</span>
+            <span class="output-line dim"> ✓ should parse config correctly (4ms)</span>
+            <span class="output-line dim"> ✓ should handle empty input (1ms)</span>
+            <span class="output-line dim"> ✓ should reject invalid tokens (3ms)</span>
+            <span class="output-line dim"> ✓ should emit events on change (5ms)</span>
+            <span class="output-line dim"> ✓ should clean up on destroy (2ms)</span>
+            <span class="output-line bold"> 6 passing (18ms)</span>
           </div>
           <div class="input-line">
-            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span
+            ><span class="cursor-block"></span>
           </div>
         </div>
       </div>
@@ -194,9 +195,12 @@
 
       const charDuration = 1.5 / command.length;
       command.split("").forEach((char, i) => {
-        tl.add(() => {
-          typedEl.textContent = command.slice(0, i + 1);
-        }, 0.5 + i * charDuration);
+        tl.add(
+          () => {
+            typedEl.textContent = command.slice(0, i + 1);
+          },
+          0.5 + i * charDuration,
+        );
       });
 
       tl.set(cursorEl, { opacity: 0 }, 2.2);
diff --git a/registry/blocks/code-snippet-apple-terminal-grass/registry-item.json b/registry/blocks/code-snippet-apple-terminal-grass/registry-item.json
index f87d10f07..646d956fe 100644
--- a/registry/blocks/code-snippet-apple-terminal-grass/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-grass/registry-item.json
@@ -4,14 +4,7 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Grass",
   "description": "Apple Terminal Grass profile: black background with green text, per-character typing animation of a shell session.",
-  "tags": [
-    "code",
-    "developer",
-    "showcase",
-    "terminal",
-    "apple",
-    "apple-terminal"
-  ],
+  "tags": ["code", "developer", "showcase", "terminal", "apple", "apple-terminal"],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-homebrew/code-snippet-apple-terminal-homebrew.html b/registry/blocks/code-snippet-apple-terminal-homebrew/code-snippet-apple-terminal-homebrew.html
index c7a7646fb..b7169c1b8 100644
--- a/registry/blocks/code-snippet-apple-terminal-homebrew/code-snippet-apple-terminal-homebrew.html
+++ b/registry/blocks/code-snippet-apple-terminal-homebrew/code-snippet-apple-terminal-homebrew.html
@@ -167,7 +167,7 @@
         </div>
         <div class="terminal-canvas">
           <div class="output-lines">
-            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys005</span>
+            <span class="output-line dim">Last login: Mon Jun 2 09:14:22 on ttys005</span>
             <span class="output-line">==> Updating Homebrew...</span>
             <span class="output-line dim">Already up-to-date.</span>
             <span class="output-line">==> Outdated formulae</span>
@@ -178,7 +178,8 @@
             <span class="output-line bright">==> Run `brew upgrade` to update 4 formulae.</span>
           </div>
           <div class="input-line">
-            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span
+            ><span class="cursor-block"></span>
           </div>
         </div>
       </div>
@@ -199,9 +200,12 @@
 
       const charDuration = 1.5 / command.length;
       command.split("").forEach((char, i) => {
-        tl.add(() => {
-          typedEl.textContent = command.slice(0, i + 1);
-        }, 0.5 + i * charDuration);
+        tl.add(
+          () => {
+            typedEl.textContent = command.slice(0, i + 1);
+          },
+          0.5 + i * charDuration,
+        );
       });
 
       tl.set(cursorEl, { opacity: 0 }, 2.2);
diff --git a/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json b/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
index 5b3a34208..baa4f3576 100644
--- a/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-homebrew/registry-item.json
@@ -4,14 +4,7 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Homebrew",
   "description": "Apple Terminal Homebrew profile: black background with bright green text and lime cursor, per-character typing animation of a shell session.",
-  "tags": [
-    "code",
-    "developer",
-    "showcase",
-    "terminal",
-    "apple",
-    "apple-terminal"
-  ],
+  "tags": ["code", "developer", "showcase", "terminal", "apple", "apple-terminal"],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-man-page/code-snippet-apple-terminal-man-page.html b/registry/blocks/code-snippet-apple-terminal-man-page/code-snippet-apple-terminal-man-page.html
index 4c0d428ec..16935d538 100644
--- a/registry/blocks/code-snippet-apple-terminal-man-page/code-snippet-apple-terminal-man-page.html
+++ b/registry/blocks/code-snippet-apple-terminal-man-page/code-snippet-apple-terminal-man-page.html
@@ -166,7 +166,7 @@
         </div>
         <div class="terminal-canvas">
           <div class="output-lines">
-            <span class="output-line section">CURL(1)                   General Commands Manual                  CURL(1)</span>
+            <span class="output-line section">CURL(1) General Commands Manual CURL(1)</span>
             <span class="output-line"></span>
             <span class="output-line section">NAME</span>
             <span class="output-line indent">curl -- transfer a URL</span>
@@ -175,10 +175,13 @@
             <span class="output-line indent">curl [options / URLs]</span>
             <span class="output-line"></span>
             <span class="output-line section">DESCRIPTION</span>
-            <span class="output-line indent">curl is a tool for transferring data from or to a server using URLs.</span>
+            <span class="output-line indent"
+              >curl is a tool for transferring data from or to a server using URLs.</span
+            >
           </div>
           <div class="input-line">
-            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span
+            ><span class="cursor-block"></span>
           </div>
         </div>
       </div>
@@ -199,9 +202,12 @@
 
       const charDuration = 1.5 / command.length;
       command.split("").forEach((char, i) => {
-        tl.add(() => {
-          typedEl.textContent = command.slice(0, i + 1);
-        }, 0.5 + i * charDuration);
+        tl.add(
+          () => {
+            typedEl.textContent = command.slice(0, i + 1);
+          },
+          0.5 + i * charDuration,
+        );
       });
 
       tl.set(cursorEl, { opacity: 0 }, 2.2);
diff --git a/registry/blocks/code-snippet-apple-terminal-man-page/registry-item.json b/registry/blocks/code-snippet-apple-terminal-man-page/registry-item.json
index 8a526fa55..2eb8a610e 100644
--- a/registry/blocks/code-snippet-apple-terminal-man-page/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-man-page/registry-item.json
@@ -4,14 +4,7 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Man Page",
   "description": "Apple Terminal Man Page profile: pale yellow background with black text, per-character typing animation of a shell session.",
-  "tags": [
-    "code",
-    "developer",
-    "showcase",
-    "terminal",
-    "apple",
-    "apple-terminal"
-  ],
+  "tags": ["code", "developer", "showcase", "terminal", "apple", "apple-terminal"],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-novel/code-snippet-apple-terminal-novel.html b/registry/blocks/code-snippet-apple-terminal-novel/code-snippet-apple-terminal-novel.html
index 4ed9246c9..0478047ad 100644
--- a/registry/blocks/code-snippet-apple-terminal-novel/code-snippet-apple-terminal-novel.html
+++ b/registry/blocks/code-snippet-apple-terminal-novel/code-snippet-apple-terminal-novel.html
@@ -161,9 +161,11 @@
         </div>
         <div class="terminal-canvas">
           <div class="output-lines">
-            <span class="output-line muted">Last login: Mon Jun  2 09:14:22 on ttys006</span>
+            <span class="output-line muted">Last login: Mon Jun 2 09:14:22 on ttys006</span>
             <span class="output-line muted">Python 3.12.4 (main, Jun 6 2024, 18:26:44)</span>
-            <span class="output-line muted">Type "help", "copyright", "credits" or "license" for more information.</span>
+            <span class="output-line muted"
+              >Type "help", "copyright", "credits" or "license" for more information.</span
+            >
             <span class="output-line bold">>>> import hyperframes</span>
             <span class="output-line bold">>>> hf = hyperframes.Composition("intro.html")</span>
             <span class="output-line">>>> hf.duration</span>
@@ -172,7 +174,8 @@
             <span class="output-line">Dimensions(width=1920, height=1080)</span>
           </div>
           <div class="input-line">
-            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span
+            ><span class="cursor-block"></span>
           </div>
         </div>
       </div>
@@ -193,9 +196,12 @@
 
       const charDuration = 1.5 / command.length;
       command.split("").forEach((char, i) => {
-        tl.add(() => {
-          typedEl.textContent = command.slice(0, i + 1);
-        }, 0.5 + i * charDuration);
+        tl.add(
+          () => {
+            typedEl.textContent = command.slice(0, i + 1);
+          },
+          0.5 + i * charDuration,
+        );
       });
 
       tl.set(cursorEl, { opacity: 0 }, 2.2);
diff --git a/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json b/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
index 47486d284..bd423554b 100644
--- a/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-novel/registry-item.json
@@ -4,14 +4,7 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Novel",
   "description": "Apple Terminal Novel profile: warm parchment background with dark brown text, per-character typing animation of a shell session.",
-  "tags": [
-    "code",
-    "developer",
-    "showcase",
-    "terminal",
-    "apple",
-    "apple-terminal"
-  ],
+  "tags": ["code", "developer", "showcase", "terminal", "apple", "apple-terminal"],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-ocean/code-snippet-apple-terminal-ocean.html b/registry/blocks/code-snippet-apple-terminal-ocean/code-snippet-apple-terminal-ocean.html
index df8fbe1ed..d16507149 100644
--- a/registry/blocks/code-snippet-apple-terminal-ocean/code-snippet-apple-terminal-ocean.html
+++ b/registry/blocks/code-snippet-apple-terminal-ocean/code-snippet-apple-terminal-ocean.html
@@ -167,17 +167,24 @@
         </div>
         <div class="terminal-canvas">
           <div class="output-lines">
-            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys007</span>
+            <span class="output-line dim">Last login: Mon Jun 2 09:14:22 on ttys007</span>
             <span class="output-line bold">docker ps</span>
-            <span class="output-line dim">CONTAINER ID   IMAGE           COMMAND                  CREATED</span>
-            <span class="output-line">a1b2c3d4e5f6   nginx:latest    "/docker-entrypoint.…"   2 hours ago</span>
-            <span class="output-line">b2c3d4e5f6a7   postgres:15     "docker-entrypoint.s…"   2 hours ago</span>
-            <span class="output-line">c3d4e5f6a7b8   redis:alpine    "docker-entrypoint.s…"   2 hours ago</span>
+            <span class="output-line dim">CONTAINER ID IMAGE COMMAND CREATED</span>
+            <span class="output-line"
+              >a1b2c3d4e5f6 nginx:latest "/docker-entrypoint.…" 2 hours ago</span
+            >
+            <span class="output-line"
+              >b2c3d4e5f6a7 postgres:15 "docker-entrypoint.s…" 2 hours ago</span
+            >
+            <span class="output-line"
+              >c3d4e5f6a7b8 redis:alpine "docker-entrypoint.s…" 2 hours ago</span
+            >
             <span class="output-line success">3 containers running</span>
             <span class="output-line dim">Use 'docker logs CONTAINER' to view output</span>
           </div>
           <div class="input-line">
-            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span
+            ><span class="cursor-block"></span>
           </div>
         </div>
       </div>
@@ -198,9 +205,12 @@
 
       const charDuration = 1.5 / command.length;
       command.split("").forEach((char, i) => {
-        tl.add(() => {
-          typedEl.textContent = command.slice(0, i + 1);
-        }, 0.5 + i * charDuration);
+        tl.add(
+          () => {
+            typedEl.textContent = command.slice(0, i + 1);
+          },
+          0.5 + i * charDuration,
+        );
       });
 
       tl.set(cursorEl, { opacity: 0 }, 2.2);
diff --git a/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json b/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
index f38e77281..d10791a32 100644
--- a/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-ocean/registry-item.json
@@ -4,14 +4,7 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Ocean",
   "description": "Apple Terminal Ocean profile: deep blue background with white text, per-character typing animation of a shell session.",
-  "tags": [
-    "code",
-    "developer",
-    "showcase",
-    "terminal",
-    "apple",
-    "apple-terminal"
-  ],
+  "tags": ["code", "developer", "showcase", "terminal", "apple", "apple-terminal"],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-pro/code-snippet-apple-terminal-pro.html b/registry/blocks/code-snippet-apple-terminal-pro/code-snippet-apple-terminal-pro.html
index 0a650a682..830fdfef2 100644
--- a/registry/blocks/code-snippet-apple-terminal-pro/code-snippet-apple-terminal-pro.html
+++ b/registry/blocks/code-snippet-apple-terminal-pro/code-snippet-apple-terminal-pro.html
@@ -167,17 +167,18 @@
         </div>
         <div class="terminal-canvas">
           <div class="output-lines">
-            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys008</span>
+            <span class="output-line dim">Last login: Mon Jun 2 09:14:22 on ttys008</span>
             <span class="output-line dim">Building production bundle...</span>
-            <span class="output-line">  vite v5.3.1 building for production...</span>
-            <span class="output-line">  ✓ 142 modules transformed.</span>
-            <span class="output-line">  dist/index.html             0.48 kB</span>
-            <span class="output-line">  dist/assets/index-Cv3rN.js  284.12 kB</span>
-            <span class="output-line">  dist/assets/index-Du4mP.css  42.08 kB</span>
-            <span class="output-line accent">  ✓ built in 2.31s</span>
+            <span class="output-line"> vite v5.3.1 building for production...</span>
+            <span class="output-line"> ✓ 142 modules transformed.</span>
+            <span class="output-line"> dist/index.html 0.48 kB</span>
+            <span class="output-line"> dist/assets/index-Cv3rN.js 284.12 kB</span>
+            <span class="output-line"> dist/assets/index-Du4mP.css 42.08 kB</span>
+            <span class="output-line accent"> ✓ built in 2.31s</span>
           </div>
           <div class="input-line">
-            <span class="prompt">user@Mac myapp % </span><span class="typed-command"></span><span class="cursor-block"></span>
+            <span class="prompt">user@Mac myapp % </span><span class="typed-command"></span
+            ><span class="cursor-block"></span>
           </div>
         </div>
       </div>
@@ -198,9 +199,12 @@
 
       const charDuration = 1.5 / command.length;
       command.split("").forEach((char, i) => {
-        tl.add(() => {
-          typedEl.textContent = command.slice(0, i + 1);
-        }, 0.5 + i * charDuration);
+        tl.add(
+          () => {
+            typedEl.textContent = command.slice(0, i + 1);
+          },
+          0.5 + i * charDuration,
+        );
       });
 
       tl.set(cursorEl, { opacity: 0 }, 2.2);
diff --git a/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json b/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
index 7b8ec472c..2dae41cc3 100644
--- a/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-pro/registry-item.json
@@ -4,14 +4,7 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Pro",
   "description": "Apple Terminal Pro profile: black background with grey text and lime green cursor, per-character typing animation of a shell session.",
-  "tags": [
-    "code",
-    "developer",
-    "showcase",
-    "terminal",
-    "apple",
-    "apple-terminal"
-  ],
+  "tags": ["code", "developer", "showcase", "terminal", "apple", "apple-terminal"],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-red-sands/code-snippet-apple-terminal-red-sands.html b/registry/blocks/code-snippet-apple-terminal-red-sands/code-snippet-apple-terminal-red-sands.html
index d2a5c87a2..fc7240eb9 100644
--- a/registry/blocks/code-snippet-apple-terminal-red-sands/code-snippet-apple-terminal-red-sands.html
+++ b/registry/blocks/code-snippet-apple-terminal-red-sands/code-snippet-apple-terminal-red-sands.html
@@ -162,19 +162,20 @@
         </div>
         <div class="terminal-canvas">
           <div class="output-lines">
-            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys009</span>
+            <span class="output-line dim">Last login: Mon Jun 2 09:14:22 on ttys009</span>
             <span class="output-line">Fetching https://api.example.com/status</span>
-            <span class="output-line dim">  HTTP/2 200</span>
-            <span class="output-line dim">  content-type: application/json</span>
-            <span class="output-line dim">  x-request-id: a3f9c21e-04b2-4d78</span>
+            <span class="output-line dim"> HTTP/2 200</span>
+            <span class="output-line dim"> content-type: application/json</span>
+            <span class="output-line dim"> x-request-id: a3f9c21e-04b2-4d78</span>
             <span class="output-line">{</span>
-            <span class="output-line">  "status": "healthy",</span>
-            <span class="output-line">  "version": "2.4.1",</span>
-            <span class="output-line bold">  "uptime": "14d 6h 32m"</span>
+            <span class="output-line"> "status": "healthy",</span>
+            <span class="output-line"> "version": "2.4.1",</span>
+            <span class="output-line bold"> "uptime": "14d 6h 32m"</span>
             <span class="output-line">}</span>
           </div>
           <div class="input-line">
-            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span
+            ><span class="cursor-block"></span>
           </div>
         </div>
       </div>
@@ -195,9 +196,12 @@
 
       const charDuration = 1.5 / command.length;
       command.split("").forEach((char, i) => {
-        tl.add(() => {
-          typedEl.textContent = command.slice(0, i + 1);
-        }, 0.5 + i * charDuration);
+        tl.add(
+          () => {
+            typedEl.textContent = command.slice(0, i + 1);
+          },
+          0.5 + i * charDuration,
+        );
       });
 
       tl.set(cursorEl, { opacity: 0 }, 2.2);
diff --git a/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json b/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
index f2baaae03..d3f08fb27 100644
--- a/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-red-sands/registry-item.json
@@ -4,14 +4,7 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Red Sands",
   "description": "Apple Terminal Red Sands profile: deep red background with sandy text, per-character typing animation of a shell session.",
-  "tags": [
-    "code",
-    "developer",
-    "showcase",
-    "terminal",
-    "apple",
-    "apple-terminal"
-  ],
+  "tags": ["code", "developer", "showcase", "terminal", "apple", "apple-terminal"],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-silver-aerogel/code-snippet-apple-terminal-silver-aerogel.html b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/code-snippet-apple-terminal-silver-aerogel.html
index c3de23dd2..7c56fbd4d 100644
--- a/registry/blocks/code-snippet-apple-terminal-silver-aerogel/code-snippet-apple-terminal-silver-aerogel.html
+++ b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/code-snippet-apple-terminal-silver-aerogel.html
@@ -170,17 +170,18 @@
         </div>
         <div class="terminal-canvas">
           <div class="output-lines">
-            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys010</span>
+            <span class="output-line dim">Last login: Mon Jun 2 09:14:22 on ttys010</span>
             <span class="output-line">Checking system resources...</span>
-            <span class="output-line">Filesystem          Size    Used   Avail  Use%</span>
-            <span class="output-line">/dev/disk3s1s1     460G    142G    302G   32%</span>
-            <span class="output-line dim">/dev/disk3s6       460G    5.0G    302G    2%</span>
-            <span class="output-line">/dev/disk3s2       460G     11G    302G    4%</span>
+            <span class="output-line">Filesystem Size Used Avail Use%</span>
+            <span class="output-line">/dev/disk3s1s1 460G 142G 302G 32%</span>
+            <span class="output-line dim">/dev/disk3s6 460G 5.0G 302G 2%</span>
+            <span class="output-line">/dev/disk3s2 460G 11G 302G 4%</span>
             <span class="output-line warn">Memory: 14.2 GB / 16.0 GB used (89%)</span>
             <span class="output-line success">CPU: 8-core, 12% load average</span>
           </div>
           <div class="input-line">
-            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span
+            ><span class="cursor-block"></span>
           </div>
         </div>
       </div>
@@ -201,9 +202,12 @@
 
       const charDuration = 1.5 / command.length;
       command.split("").forEach((char, i) => {
-        tl.add(() => {
-          typedEl.textContent = command.slice(0, i + 1);
-        }, 0.5 + i * charDuration);
+        tl.add(
+          () => {
+            typedEl.textContent = command.slice(0, i + 1);
+          },
+          0.5 + i * charDuration,
+        );
       });
 
       tl.set(cursorEl, { opacity: 0 }, 2.2);
diff --git a/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
index 674bd5c40..c42a2797e 100644
--- a/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-silver-aerogel/registry-item.json
@@ -4,14 +4,7 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Silver Aerogel",
   "description": "Apple Terminal Silver Aerogel profile: dark grey background with white text, per-character typing animation of a shell session.",
-  "tags": [
-    "code",
-    "developer",
-    "showcase",
-    "terminal",
-    "apple",
-    "apple-terminal"
-  ],
+  "tags": ["code", "developer", "showcase", "terminal", "apple", "apple-terminal"],
   "dimensions": {
     "width": 1920,
     "height": 1080
diff --git a/registry/blocks/code-snippet-apple-terminal-solid-colors/code-snippet-apple-terminal-solid-colors.html b/registry/blocks/code-snippet-apple-terminal-solid-colors/code-snippet-apple-terminal-solid-colors.html
index 55cc6a4c6..f8164fb0c 100644
--- a/registry/blocks/code-snippet-apple-terminal-solid-colors/code-snippet-apple-terminal-solid-colors.html
+++ b/registry/blocks/code-snippet-apple-terminal-solid-colors/code-snippet-apple-terminal-solid-colors.html
@@ -167,17 +167,18 @@
         </div>
         <div class="terminal-canvas">
           <div class="output-lines">
-            <span class="output-line dim">Last login: Mon Jun  2 09:14:22 on ttys011</span>
+            <span class="output-line dim">Last login: Mon Jun 2 09:14:22 on ttys011</span>
             <span class="output-line">Initializing HyperFrames project...</span>
-            <span class="output-line dim">  Creating project structure</span>
-            <span class="output-line dim">  Copying template files</span>
-            <span class="output-line dim">  Installing dependencies</span>
-            <span class="output-line">  added 142 packages in 3.4s</span>
-            <span class="output-line accent">  ✓ Project ready at ./my-video</span>
-            <span class="output-line bold">  Run: cd my-video && npx hyperframes preview</span>
+            <span class="output-line dim"> Creating project structure</span>
+            <span class="output-line dim"> Copying template files</span>
+            <span class="output-line dim"> Installing dependencies</span>
+            <span class="output-line"> added 142 packages in 3.4s</span>
+            <span class="output-line accent"> ✓ Project ready at ./my-video</span>
+            <span class="output-line bold"> Run: cd my-video && npx hyperframes preview</span>
           </div>
           <div class="input-line">
-            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span><span class="cursor-block"></span>
+            <span class="prompt">user@Mac ~ % </span><span class="typed-command"></span
+            ><span class="cursor-block"></span>
           </div>
         </div>
       </div>
@@ -198,9 +199,12 @@
 
       const charDuration = 1.5 / command.length;
       command.split("").forEach((char, i) => {
-        tl.add(() => {
-          typedEl.textContent = command.slice(0, i + 1);
-        }, 0.5 + i * charDuration);
+        tl.add(
+          () => {
+            typedEl.textContent = command.slice(0, i + 1);
+          },
+          0.5 + i * charDuration,
+        );
       });
 
       tl.set(cursorEl, { opacity: 0 }, 2.2);
diff --git a/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json b/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
index 0445f2420..b9c41e2f8 100644
--- a/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
+++ b/registry/blocks/code-snippet-apple-terminal-solid-colors/registry-item.json
@@ -4,14 +4,7 @@
   "type": "hyperframes:block",
   "title": "Code Snippet - Apple Terminal Solid Colors",
   "description": "Apple Terminal Solid Colors profile: deep purple background with white text, per-character typing animation of a shell session.",
-  "tags": [
-    "code",
-    "developer",
-    "showcase",
-    "terminal",
-    "apple",
-    "apple-terminal"
-  ],
+  "tags": ["code", "developer", "showcase", "terminal", "apple", "apple-terminal"],
   "dimensions": {
     "width": 1920,
     "height": 1080