InlineCode

Identifiers inside running text: tool names, file names, short commands.

DataServer-rendered

Examples

In a sentence

Light

Agents call search_tools first, then create_issue on the GitHub server. Project settings live in .mcp.json.

Dark

Agents call search_tools first, then create_issue on the GitHub server. Project settings live in .mcp.json.

Example

Wrap

<Text>
  Agents call <InlineCode>search_tools</InlineCode> first, then <InlineCode>create_issue</InlineCode> on the
  GitHub server. Project settings live in <InlineCode>.mcp.json</InlineCode>.
</Text>

At small sizes

Sized at 0.9em, so it follows the text around it.

The pdf-forms skill loads when an agent asks to fill a PDF.

Example

Wrap

<Text size="sm" tone="ink-2">
  The <InlineCode>pdf-forms</InlineCode> skill loads when an agent asks to fill a PDF.
</Text>

Usage

Wrap

import { InlineCode } from '@switchboard/ui'

<Text>Enable <InlineCode>{tool.name}</InlineCode> to let agents call it.</Text>

Props

Every component also takes mix, for css() and mixins applied after its own style.

`InlineCode`

InlineCode props
Prop	Type	Default	Description
mix	Mix	–	Extra css() or mixins, applied after the code style.

Accepts every <code> attribute. Children are the code text.

Accessibility

Renders a native <code> element; screen readers read the text as written.
Long identifiers break anywhere rather than overflow their line.

Guidance

Do

Use it for things a person types or reads in another program.
Write the identifier exactly, with its case and punctuation.

Don’t

Use it for emphasis or for product names like GitHub.
Put multi-line snippets in it; use CodeBlock.