{
  "$schema": "https://mintlify.com/docs.json",
  "name": "HyperFrames",
  "theme": "maple",
  "colors": {
    "primary": "#0a0a0a",
    "light": "#f6f5f1",
    "dark": "#0a0a0a"
  },
  "background": {
    "color": {
      "light": "#f6f5f1",
      "dark": "#0a0a0a"
    }
  },
  "fonts": {
    "family": "Inter",
    "heading": {
      "family": "Inter"
    }
  },
  "appearance": {
    "default": "light"
  },
  "logo": {
    "light": "/logo/light.svg",
    "dark": "/logo/dark.svg"
  },
  "favicon": "/favicon.svg",
  "contextual": {
    "options": [
      "copy",
      "claude",
      "cursor",
      "vscode",
      "windsurf",
      "mcp",
      {
        "title": "Open an issue",
        "description": "Report a bug or request a feature",
        "icon": "github",
        "iconType": "brands",
        "href": "https://github.com/heygen-com/hyperframes/issues/new"
      }
    ]
  },
  "navigation": {
    "tabs": [
      {
        "tab": "Documentation",
        "groups": [
          {
            "group": "Getting Started",
            "pages": [
              "introduction",
              "quickstart",
              "examples",
              "launch-videos"
            ]
          },
          {
            "group": "Concepts",
            "pages": [
              "concepts/compositions",
              "concepts/data-attributes",
              "concepts/variables",
              "concepts/frame-adapters",
              "concepts/determinism"
            ]
          },
          {
            "group": "Guides",
            "pages": [
              "guides/html-in-canvas",
              "guides/website-to-video",
              "guides/claude-design",
              "guides/open-design",
              "guides/prompting",
              "guides/hyperframes-vs-remotion",
              "guides/gsap-animation",
              "guides/rendering",
              "guides/deploy",
              "guides/remove-background",
              "guides/hdr",
              "guides/4k-rendering",
              "guides/performance",
              "guides/timeline-editing",
              "guides/video-editor-cheatsheet",
              "guides/common-mistakes",
              "guides/troubleshooting"
            ]
          }
        ]
      },
      {
        "tab": "Catalog",
        "groups": [
          {
            "group": "Captions",
            "pages": [
              "catalog/components/caption-clip-wipe",
              "catalog/components/caption-editorial-emphasis",
              "catalog/components/caption-emoji-pop",
              "catalog/components/caption-glitch-rgb",
              "catalog/components/caption-gradient-fill",
              "catalog/components/caption-highlight",
              "catalog/components/caption-kinetic-slam",
              "catalog/components/caption-matrix-decode",
              "catalog/components/caption-neon-accent",
              "catalog/components/caption-neon-glow",
              "catalog/components/caption-parallax-layers",
              "catalog/components/caption-particle-burst",
              "catalog/components/caption-pill-karaoke",
              "catalog/components/caption-texture-lava",
              "catalog/components/caption-typewriter",
              "catalog/components/caption-weight-shift"
            ]
          },
          {
            "group": "HTML-in-Canvas",
            "pages": [
              "catalog/blocks/vfx-iphone-device",
              "catalog/blocks/vfx-liquid-background",
              "catalog/blocks/vfx-liquid-glass",
              "catalog/blocks/vfx-magnetic",
              "catalog/blocks/vfx-portal",
              "catalog/blocks/vfx-shatter",
              "catalog/blocks/vfx-text-cursor"
            ]
          },
          {
            "group": "Social Overlays",
            "pages": [
              "catalog/blocks/instagram-follow",
              "catalog/blocks/macos-notification",
              "catalog/blocks/reddit-post",
              "catalog/blocks/spotify-card",
              "catalog/blocks/tiktok-follow",
              "catalog/blocks/x-post",
              "catalog/blocks/yt-lower-third"
            ]
          },
          {
            "group": "Shader Transitions",
            "pages": [
              "catalog/blocks/chromatic-radial-split",
              "catalog/blocks/cinematic-zoom",
              "catalog/blocks/cross-warp-morph",
              "catalog/blocks/domain-warp-dissolve",
              "catalog/blocks/flash-through-white",
              "catalog/blocks/glitch",
              "catalog/blocks/gravitational-lens",
              "catalog/blocks/light-leak",
              "catalog/blocks/ridged-burn",
              "catalog/blocks/ripple-waves",
              "catalog/blocks/sdf-iris",
              "catalog/blocks/swirl-vortex",
              "catalog/blocks/thermal-distortion",
              "catalog/blocks/whip-pan"
            ]
          },
          {
            "group": "CSS Transitions",
            "pages": [
              "catalog/blocks/transitions-3d",
              "catalog/blocks/transitions-blur",
              "catalog/blocks/transitions-cover",
              "catalog/blocks/transitions-destruction",
              "catalog/blocks/transitions-dissolve",
              "catalog/blocks/transitions-distortion",
              "catalog/blocks/transitions-grid",
              "catalog/blocks/transitions-light",
              "catalog/blocks/transitions-mechanical",
              "catalog/blocks/transitions-other",
              "catalog/blocks/transitions-push",
              "catalog/blocks/transitions-radial",
              "catalog/blocks/transitions-scale"
            ]
          },
          {
            "group": "Showcases",
            "pages": [
              "catalog/blocks/app-showcase",
              "catalog/blocks/apple-money-count",
              "catalog/blocks/blue-sweater-intro-video",
              "catalog/blocks/north-korea-locked-down",
              "catalog/blocks/nyc-paris-flight",
              "catalog/blocks/ui-3d-reveal",
              "catalog/blocks/vpn-youtube-spot"
            ]
          },
          {
            "group": "Data",
            "pages": [
              "catalog/blocks/data-chart"
            ]
          },
          {
            "group": "Effects",
            "pages": [
              "catalog/components/grain-overlay",
              "catalog/components/grid-pixelate-wipe",
              "catalog/components/shimmer-sweep",
              "catalog/components/texture-mask-text",
              "catalog/components/vignette"
            ]
          },
          {
            "group": "Blocks",
            "pages": [
              "catalog/blocks/flowchart",
              "catalog/blocks/logo-outro"
            ]
          }
        ]
      },
      {
        "tab": "Packages",
        "groups": [
          {
            "group": "Packages",
            "pages": [
              "packages/core",
              "packages/engine",
              "packages/player",
              "packages/producer",
              "packages/studio",
              "packages/cli"
            ]
          },
          {
            "group": "Deploy",
            "pages": [
              "deploy/aws-lambda",
              "deploy/migrating-to-hyperframes-lambda"
            ]
          }
        ]
      },
      {
        "tab": "Reference",
        "groups": [
          {
            "group": "Reference",
            "pages": [
              "reference/html-schema"
            ]
          },
          {
            "group": "Contributing",
            "pages": [
              "contributing",
              "contributing/catalog",
              "contributing/release-channels",
              "contributing/testing-local-changes",
              "contributing/studio-manual-dom-editing"
            ]
          },
          {
            "group": "Community",
            "pages": [
              "community/adopters"
            ]
          }
        ]
      }
    ]
  },
  "footer": {
    "socials": {
      "github": "https://github.com/heygen-com/hyperframes"
    }
  }
}