> For the complete documentation index, see [llms.txt](https://docs.heisenware.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.heisenware.com/~/changes/Q625pQNc0nXqVGPtyjAY/building-apps/ui-elements/text-box.md).
# Text box
Static UI elements are serving design and usability of apps. They include text boxes, shapes, icons, and images. Apart from icons, those elements don't offer any additional functionality.
## Text box
To add text:
1. Click on the text box icon in the top bar. 
2. Hover above the UI editor and click where you want to place the text box.
3. Double click into the text box to write text and change formatting.
Use the appearing top bar to change font, font size, color, and other formatting of the text box.
## Table
To add a table:
1. Follow steps 1-3 of the text box instructions.
2. Click on the appearing vertical dots icon in the top bar. 
3. Click on `Insert table`.
4. Define the number of columns and lines of the table.
5. Click `OK`.
## Shape
For your app, you can use the following shapes:
* Arc
* Circle
* Ellipse
* Rectangle
* Ring
* Star
To add a shape:
1. Click on the shapes icon in the top bar. 
2. Select a shape from the list.
3. Hover above the UI editor and click where you want to place the shape
Access the shape settings via the settings icon (:gear:) in the top bar to configure a shape. In the shape settings, you can:
* define border weight
* define opacity
* enable shadow
* add an animation (appear on hover)
* adjust fill color
* adjust border color
* add an identifier
## Icon
1. Click on the icons icon in the top bar. 
2. Select an icon from the dropdown.
3. Hover above the UI editor and click where you want to place the icon.
Access the icon settings via the settings icon (:gear:) in the top bar to configure an icon. In the icon settings, you can:
* pick a style (solid, regular, light, thin, duotone)
* adjust fill color
Icons can be used for [in-app navigation](/~/changes/Q625pQNc0nXqVGPtyjAY/building-apps/app-appearance/in-app-navigation.md#widget-navigation), too. Simply drag and drop a page or subpage using its handle onto an icon to make it a page link.
## Image
To add an image to the UI, upload it to [resources ](/~/changes/Q625pQNc0nXqVGPtyjAY/building-apps/data-and-file-storage/file-server.md)first. Now, you can drag and drop it from the file manager to the desired place in the UI editor.
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.
Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:
```
GET https://docs.heisenware.com/~/changes/Q625pQNc0nXqVGPtyjAY/building-apps/ui-elements/text-box.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.