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

# Components

Browse every built-in HolyDocs MDX component by job, with dedicated pages, rendered previews, props, code samples, and cross-links to the interactive playground.

HolyDocs ships with a growing library of built-in MDX components for structure, navigation, code, visuals, API reference pages, interactivity, and Web3 workflows. Every component is globally available in `.mdx` files with no imports.

**Interactive playground**

Need isolated previews, theme switching, and sandbox editing? Open [holydocs.com/components](https://holydocs.com/components) and then return here for production-focused guidance, props, tips, and related patterns.

**What Every Component Page Includes**

**[Rendered Examples](/components/callout)**

See the component render directly in HolyDocs, usually in multiple practical variations.
    **[Props & Usage](/components/param-field)**

Get a props table, starter snippet, and implementation notes without leaving the page.
    **[Related Patterns](/components/card-group)**

Jump to adjacent components when you need a stronger pattern than the first one you tried.
    **[Docs + Playground](https://holydocs.com/components)**

Move between the interactive marketing playground and the docs reference for the same component slug.

## Browse by job

**[Structure & Layout](/components/tabs)**

Tabs, steps, accordions, panels, data tables, and layout helpers.
  **[Notices & Guidance](/components/callout)**

Callouts, banners, badges, checklists, shortcuts, and rollout guidance.
  **[Navigation](/components/card)**

Cards, card groups, trees, and visual tiles for IA-heavy pages.
  **[Code & Syntax](/components/code-block)**

Code blocks, code groups, mermaid diagrams, diffs, and terminal replays.
  **[Media & Visuals](/components/screenshot)**

Screenshots, LittleDemo embeds, carousels, diagrams, charts, prompts, colors, and comparison sliders.
  **[Interactive](/components/quiz)**

Quizzes, forms, and other surfaces that ask readers to do something, not just read.
  **[API Reference](/components/endpoint)**

Endpoint headers, field docs, request and response examples, schemas, and webhook shapes.
  **[Web3](/components/address)**

Addresses, chain badges, token math, add-network flows, and contract-call helpers.

The highest-leverage docs improvement is still page granularity. Keep component reference pages narrow, example-rich, and easy to cross-link from product docs, changelogs, and marketing pages.