Skip to main content

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 Modern

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

​
Install

npx hyperframes add code-snippet-dark-modern
Install all code snippet themes at once:
Terminal
npx hyperframes add code

​
Details

PropertyValue
TypeBlock
Dimensions1920×1080
Duration11s

​
Files

FileTargetType
code-snippet-dark-modern.htmlcompositions/code-snippet-dark-modern.htmlhyperframes:composition
background.jpegassets/background.jpeghyperframes:asset

​
Usage

After installing, add the block to your host composition: 
<div
  data-composition-id="code-snippet-dark-modern"
  data-composition-src="compositions/code-snippet-dark-modern.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