The CodeDecorator component enhances the standard inline <code> element by applying consistent, readable styling that helps technical text stand out within a sentence or paragraph.
It’s designed to be used when you need to reference commands, variables, file names, or brief code fragments without breaking the flow of surrounding content. It ensures that inline code remains easy to identify across documentation, UI copy, and developer-facing experiences.
If you need longer code snippets or code blocks please use the CodeEditor component.
Variants
Variants contain different versions of the component depending on specific properties, such as state, size, colour, optional iconography, etc.
| Property | Values | Default |
|---|---|---|
| type Variant | neutral | highlight | neutral |
| ✏️ labelText Text | string | label |
Help and support