--- path: components/promptbox/overview title: Overview position: 1 seo_title: Overview of the PromptBox Component seo_description: Learn about the basic features of the Telerik and Kendo UI PromptBox component and its types, check out the extensive set of available options in its live demo. --- ## PromptBox Overview The PromptBox component is a flexible, customizable input interface for interacting with LLMs and chatbots, enabling users to compose, view, and submit prompts or messages. Built on native HTML `` and `

` elements, it offers single-line, multi-line, or auto-resize options for displaying text, making it optimized for AI prompts and conversational interfaces. The component supports user input, file uploads, speech-to-text conversion, and provides extensive customization options for layout configurations.

### Live Demo

### Appearance

PromptBoxes provide built-in styling options that grant visually appealing and flexible rendering experience.

#### States

Depending on the action you want to imply through its appearance, the Telerik and Kendo UI PromptBox can acquire and can be rendered in the following states:

* A PromptBox in its normal state is active, but the user is not interacting with it. This is the default state of the component. It can contain an explanatory placeholder text or an already prefilled text.
* `k-hover`—The hover state of a PromptBox is applied when the user hovers over the component but does not click it. The mouse pointer changes to indicate that you can type into the component.
* `k-focus`—The focus state of the PromptBox is triggered when the user navigates to the component by keyboard, voice, or mouse click. This state must highlight the PromptBox so that it covers all [accessibility requirements](/foundation/guides/accessibility/manage-focus/).
* `k-disabled`—The disabled state of the PromptBox indicates that the user cannot interact with the component. When disabled, the component has no interactive behavior, it is faded out and slightly out of focus, which helps the user to distinguish it from the active elements on the page.

### Framework-Specific Documentation

For specific information about the component, refer to its official product documentation:

<Wrap>
<ExternalResource data='{"title":"Kendo UI for Angular PromptBox","description":"Find more information about the Kendo UI for Angular PromptBox in the official product documentation of the component.","url":"https://www.telerik.com/kendo-angular-ui/components/conversational-ui/promptbox/"}'>![Kendo UI for Angular logo.](/images/angular-logo.svg)</ExternalResource>

<ExternalResource data='{"title":"Telerik UI for Blazor PromptBox","description":"Find more information about the Telerik UI for Blazor PromptBox in the official product documentation of the component.","url":"https://docs.telerik.com/blazor-ui/components/promptbox/overview"}'>![Telerik UI for Blazor logo.](/images/blazor-logo.svg)</ExternalResource>

<ExternalResource data='{"title":"Kendo UI for jQuery PromptBox","description":"Find more information about the Kendo UI for jQuery PromptBox in the official product documentation of the component.","url":"https://docs.telerik.com/kendo-ui/controls/promptbox/overview"}'>![Kendo UI logo.](/images/jquery-logo.svg)</ExternalResource>

<ExternalResource data='{"title":"KendoReact PromptBox","description":"Find more information about the KendoReact PromptBox in the official product documentation of the component.","url":"https://www.telerik.com/kendo-react-ui/components/conversationalui/promptbox/"}'>![KendoReact logo.](/images/react-logo.svg)</ExternalResource>

<ExternalResource data='{"title":"Kendo UI for Vue PromptBox","description":"Find more information about the Kendo UI for Vue PromptBox in the official product documentation of the component.","url":"https://www.telerik.com/kendo-vue-ui/components/conversationalui/promptbox/"}'>![Kendo UI for Vue logo.](/images/vue-logo.svg)</ExternalResource>

<ExternalResource data='{"title":"Telerik UI for ASP.NET Core PromptBox","description":"Find more information about the Telerik UI for ASP.NET Core PromptBox component.","url":"https://docs.telerik.com/aspnet-core/html-helpers/conversational-ui/promptbox/overview"}'>![Telerik UI for ASP.NET Core logo.](/images/core-logo.svg)</ExternalResource>

<ExternalResource data='{"title":"Telerik UI for ASP.NET MVC PromptBox","description":"Find more information about the Telerik UI for ASP.NET MVC PromptBox component.","url":"https://docs.telerik.com/aspnet-mvc/html-helpers/conversational-ui/promptbox/overview"}'>![Telerik UI for ASP.NET MVC logo.](/images/mvc-logo.svg)</ExternalResource>
</Wrap>