Callout

from @docscn

Callout for notes and warnings, with info, warning, error, success and idea types.

Install

New to shadcn? Set up your project

If your project already has a shadcn components.json, skip initialization. Otherwise, run this once from your project root.

$pnpm dlx shadcn@latest init

Setup by framework · Configure a registry namespace

$pnpm dlx shadcn@latest add @docscn/callout

Live preview

No live preview has been built for this component yet.

Registry dependencies1

alert

Packages2

More from @docscn, 36 components

All @docscn

AI chat component
@docscn
The AI chat UI for the layouts' aiChat option, built on the AI SDK: AIChatProvider, AIChatPanel, AIChatTrigger and AIChatSearch, with streamed Markdown answers and translated strings. Installs into components/ai/chat, where Fumadocs' CLI puts it.
AI7 registry deps · 10 packages
Banner component
@docscn
Banner: an announcement bar above the layout, optionally dismissible and with a rainbow variant, that offsets docscn's layouts by its height.
Feedback1 registry dep · 3 packages
Card component
@docscn
Cards and Card: a grid of link cards with an icon, title and description.
Layout1 registry dep · 2 packages
Code block component
@docscn
CodeBlock and CodeBlockTabs for Fumadocs MDX's Shiki output: title, icon, copy button, code tabs, and the styles for dual themes, highlights, diffs, focus and line numbers.
Navigation3 registry deps · 3 packages
Accordion component
@docscn
Accordions and Accordion: collapsible sections that open from the URL hash and have a copy-link button.
Layout3 registry deps · 3 packages
Docs layout component
@docscn
DocsLayout: the docs layout on the shadcn/ui sidebar, with the page tree, search, layout tabs, links, a theme switch and a mobile navbar.
Navigation11 registry deps · 3 packages
Docs page component
@docscn
DocsPage, DocsTitle, DocsDescription and DocsBody, with the breadcrumb, previous/next links, the table of contents (a popover on small screens), EditOnGitHub and PageLastUpdate.
Overlays9 registry deps · 4 packages
Docs sidebar component
@docscn
SidebarPageTree renders a Fumadocs page tree (pages, folders, separators, icons, external links) with the shadcn/ui sidebar menu, and SidebarLinkItem renders layout links.
Navigation5 registry deps · 5 packages
Tabs component
@docscn
Tabs and Tab for MDX content: tabs from a list of items or with explicit values, with selections shared between tab groups, persisted, or linked from the URL hash.
Navigation2 registry deps · 1 package
Dynamic code block component
@docscn
DynamicCodeBlock: a code block highlighted with Shiki in the browser, for code that's only known at runtime.
Other1 registry dep · 3 packages
Files component
@docscn
Files, Folder and File: a file tree with collapsible folders, also rendered from remark-mdx-files output.
Layout1 registry dep · 3 packages
GitHub info component
@docscn
GithubInfo: a link to a GitHub repository with its star and fork counts, fetched on the server.
Other2 packages

The Signal

Install

Live preview

Registry dependencies1

Packages2

Install

Live preview

Registry dependencies1

Packages2

Source

More from @docscn36, 36 components

More from @docscn, 36 components