Files
hyperframes/docs/catalog/blocks/yt-prism-title.mdx
T

45 lines
1.3 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
---
title: "Chromatic Fringe Title"
description: "Display title on a transparent root: blur-focus entrance, red/blue fringe that settles then breathes, perspective bow, slow scale drift"
---
# Chromatic Fringe Title
Display title on a transparent root: blur-focus entrance, red/blue fringe that settles then breathes, perspective bow, slow scale drift
`typography` `title-card` `creator`
<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/yt-prism-title.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/yt-prism-title.png" autoPlay muted loop playsInline />
## Install
<CodeGroup>
```bash Terminal
npx hyperframes add yt-prism-title
```
</CodeGroup>
## Details
| Property | Value |
| --- | --- |
| Type | Block |
| Dimensions | 1920×1080 |
| Duration | 6s |
## Files
| File | Target | Type |
| --- | --- | --- |
| `yt-prism-title.html` | `compositions/yt-prism-title.html` | hyperframes:composition |
## Usage
After installing, add the block to your host composition:
```html
<div data-composition-id="yt-prism-title" data-composition-src="compositions/yt-prism-title.html" data-start="0" data-duration="6" data-track-index="1" data-width="1920" data-height="1080"></div>
```