---
url: "https://vueda.dev/v3/reference/theming/keys/InputGroupText.md"
title: "InputGroupText"
---

# InputGroupText

Source: `client/lib/theme/vueda-tailwind/controls/index.js`

> The inline-text addon inside an [InputGroup.root](/v3/reference/theming/keys/InputGroup.md#theme-key-InputGroup-root): helper labels, prefix / suffix copy, unit markers. Renders at sm size on `--muted-foreground` with 16px icons so the addon reads as chrome rather than as input content.

Vue component: [InputGroupText](/v3/reference/api/vue/InputGroupText.md)

| Slot | Default classes | Description |
| --- | --- | --- |
| [root](/v3/reference/theming/keys/InputGroupText.md#theme-key-InputGroupText-root) | 2 classes | The inline-text addon inside an [InputGroup.root](/v3/reference/theming/keys/InputGroup.md#theme-key-InputGroup-root): helper labels, prefix / suffix copy, unit markers. Renders at sm size on `--muted-foreground` with 16px icons so the addon reads as chrome rather than as input content. |

<a id="theme-key-InputGroupText-root"></a>

## root

> The inline-text addon inside an [InputGroup.root](/v3/reference/theming/keys/InputGroup.md#theme-key-InputGroup-root): helper labels, prefix / suffix copy, unit markers. Renders at sm size on `--muted-foreground` with 16px icons so the addon reads as chrome rather than as input content.

Default classes:

```text
text-muted-foreground flex items-center gap-2 text-sm
[&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4
```

Source: `client/lib/theme/vueda-tailwind/controls/InputGroupText.theme.js:17`