For AI agents: a documentation index is available at the root level at /llms.txt and /llms-full.txt. Append /llms.txt to any URL for a page-level index, or .md for the markdown version of any page.
Book a demoLog inStart for free
  • Getting started
    • Overview
    • How it works
    • Quickstart
    • Project structure
    • Customer showcase
    • Changelog
  • Configuration
    • Overview
    • Site-level settings
    • Page-level settings
  • Writing content
    • Markdown basics
    • Rich media in Markdown
    • Fern Editor
    • Reusable snippets
  • AI features
    • Overview
    • Fern Writer
    • AI-generated examples
    • Markdown access
      • Overview
      • Customize LLM output
      • Agent directives
      • Analytics and integration
    • MCP server
    • API catalog discovery
      • Overview
        • Slack app
        • Custom guidance
        • Additional content sources
        • Standalone search widget
  • Public API
    • GETJWT from Fern API key
    • GETAlgolia search credentials
    • GETCurrent user information
  • Fern Writer API
    • GETGet Fern Writer Install Link
Checking status...
SOC2Soc 2 Type II
© 2026 Fern • Birch Solutions, Inc., a Postman company

Documentation

SDKsDocsAsk FernCLI Reference

API Definitions

OpenAPIAsyncAPIOpenRPCgRPC

Resources

BlogSupportPricing

Company

Brand KitPrivacy PolicyTerms of Service
LogoLogo
Book a demoLog inStart for free
On this page
  • Prerequisites
  • Getting started
  • Properties
AI featuresAsk FernSetup

Standalone search widget

||View as Markdown|
Was this page helpful?
Edit this page
Previous

Additional content sources

Next

Introduction

The @fern-api/search-widget package provides a standalone React component that brings Ask Fern’s AI-powered search to any React application outside of your Fern Docs site. Embed a search modal in your dashboard, marketing site, or internal tool so users can find relevant documentation without leaving their workflow.

Search widget embedded in a dashboard. Try the live demo or browse the demo source.

Prerequisites

  • React 19 — all other dependencies are bundled.
  • A live, cloud-hosted Fern Docs site with Ask Fern enabled — the widget connects to your published docs site at runtime. Self-hosted and local preview environments aren’t supported.
  • Public documentation — the widget only supports public docs. If your site uses authentication, the widget will only return unauthenticated results.

Getting started

1

Install the package

$npm install @fern-api/search-widget react@19 react-dom@19
2

Add the search modal

Import SearchModal and the bundled styles, then render the component with your docs domain. The component renders a button that opens a search modal when clicked.

1import { SearchModal } from '@fern-api/search-widget';
2import '@fern-api/search-widget/styles';
3
4function App() {
5  return (
6    <SearchModal domain="https://docs.example.com" lang="en">
7      Search Docs
8    </SearchModal>
9  );
10}
3

Customize the trigger button

The SearchModal component renders a button that opens the search modal. Style it with className, style, or target the default fern-search-button class. All standard HTML button attributes are forwarded.

1<SearchModal
2  domain="https://docs.example.com"
3  lang="en"
4  className="my-search-button"
5>
6  Search Docs
7</SearchModal>

Properties

All standard HTML button attributes are also supported and forwarded to the trigger button.

domain
stringRequired

The URL of your published Fern Docs site (for example, https://docs.example.com). Include the full path if your docs aren’t at the root (for example, https://buildwithfern.com/learn).

lang
stringDefaults to en

Language code for the search interface.

icon
React.ReactNode

Icon element to display in the button.

className
string

CSS class names for the trigger button.

style
React.CSSProperties

Inline styles for the trigger button.

children
React.ReactNode

Button content (text, icons, etc.).

disabled
boolean

Disables the button.

onClick
function

Additional click handler that runs before the modal opens.