Agent-readable docs index: /llms.txt. Full docs in one file: /llms-full.txt. Download /docs.zip to grep all markdown files locally.

Components

This section follows the same broad structure as Mintlify's component docs, but the examples render through Holocron's actual MDX component map.

Browse by use case

Structure content
Columns, cards, steps, tiles, and tree layouts.
Draw attention
Callouts, badges, banner config, tooltips, and updates.
Show hidden content
Accordions, expandables, tabs, and views.
Document APIs
Fields, responses, request examples, response examples, and panel layouts.
Right sidebar
Place notes, API examples, or a wider rail with Aside.
Visual helpers
Icons, color tokens, frames, mermaid diagrams, and previews.
AI-oriented UI
Prompt cards and examples useful for agent-facing docs.

Importing components in .tsx files

All MDX components are available from @holocron.so/vite/mdx. This is useful when you build custom components that compose Holocron primitives:
import { Card, CardGroup, Callout, Steps, Step } from '@holocron.so/vite/mdx' export function FeatureGrid({ features }) { return ( <CardGroup cols={3}> {features.map((f) => ( <Card key={f.title} title={f.title} icon={f.icon}> {f.description} </Card> ))} </CardGroup> ) }
You only need this import when writing .tsx component files. In MDX pages, all components are available globally without imports.

What to expect on each page

  • A short explanation of the Mintlify component concept
  • Holocron examples that actually render in this repo
  • A Holocron differences section when parity is incomplete or behavior differs
Some Mintlify docs describe behaviors that are broader than Holocron's current implementation. Those differences are called out explicitly instead of being hidden.

Video background shader

VideoBackgroundShader is a Holocron-only WebGL video background. Video luminance drives a dot grid. Mouse movement adds fluid splats.
To wash the dots out, set dotAlphaMultiplier (0-1, default 1). That multiplies painted-dot alpha in the shader.
<VideoBackgroundShader src="/hero-bg.mp4" dotColor="#8da4ff" dotAlphaMultiplier={0.4} />
Do not use canvasClassName opacity for that. Classes like opacity-40 or dark:opacity-60 fade the whole canvas layer, including the fade-in wrapper. They do not change how strong the dots are.
canvasClassName is still valid for extra classes on the canvas container only. Gradients and children do not receive it.