> ## Documentation Index
> Fetch the complete documentation index at: https://hyperframes.mintlify.app/llms.txt
> Use this file to discover all available pages before exploring further.

# Dark+

> Classic dark theme with enhanced syntax highlighting for popular languages.

# Dark+

VS Code workbench with per-character typing animation in the Dark+ theme. Full editor chrome with activity bar, sidebar, tabs, terminal, and status bar.

`code` `developer` `showcase` `vscode`

<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-dark-plus.mp4" poster="https://static.heygen.ai/hyperframes-oss/docs/images/catalog/blocks/code-snippet-dark-plus.png" autoPlay muted loop playsInline />

## Install

<CodeGroup>
  ```bash Terminal theme={null}
  npx hyperframes add code-snippet-dark-plus
  ```
</CodeGroup>

Install all code snippet themes at once:

```bash Terminal theme={null}
npx hyperframes add code
```

## Details

| Property   | Value     |
| ---------- | --------- |
| Type       | Block     |
| Dimensions | 1920×1080 |
| Duration   | 11s       |

## Files

| File                          | Target                                     | Type                    |
| ----------------------------- | ------------------------------------------ | ----------------------- |
| `code-snippet-dark-plus.html` | `compositions/code-snippet-dark-plus.html` | hyperframes:composition |
| `background.jpeg`             | `assets/background.jpeg`                   | hyperframes:asset       |

## Usage

After installing, add the block to your host composition:

```html theme={null}
<div
  data-composition-id="code-snippet-dark-plus"
  data-composition-src="compositions/code-snippet-dark-plus.html"
  data-start="0"
  data-duration="11"
  data-track-index="1"
  data-width="1920"
  data-height="1080"
></div>
```

## Features

* Full VS Code workbench recreation — activity bar, sidebar, explorer tree, editor tabs, breadcrumbs, terminal panel, status bar
* Per-character typing animation with cursor tracking and active line highlight
* Colors sourced from official `microsoft/vscode` built-in theme JSON
* 3D perspective tilt at the end of the typing sequence
* Terminal panel with mock test output