Code Decorator enhances the standard inline <code> element by applying consistent, readable styling that helps technical text stand out within a sentence or paragraph.
It ensures that inline code remains easy to identify across documentation, UI copy, and developer-facing experiences.
Anatomy
Anatomy summary lists and describes all the elements within a component (including nested components).
|
Element |
Description |
Optional? |
|---|---|---|
|
1. Container |
Background that helps differentiate code snippet from normal text. |
No |
|
2. Label |
A short code snippet. |
No |
Variants
Variants contain different versions of the component depending on specific properties, such as state, size, colour, optional iconography, etc.
| Property | Values | Default |
|---|---|---|
| ✏️ labelText Text | string | label |
Help and support