# Design Guide

- [Alerts and warnings](https://dev.xena.biz/xena-developer/user-interface/styleguide/alertsandwarnings.md): Display information and warnings in a clear way.
- [Buttons](https://dev.xena.biz/xena-developer/user-interface/styleguide/buttons.md): Overview of button usage.
- [Colors and fonts](https://dev.xena.biz/xena-developer/user-interface/styleguide/fontandcolors.md): Overview of colors and use of fonts.
- [Collapsible](https://dev.xena.biz/xena-developer/user-interface/styleguide/collapsible.md): Expand and collapse content.
- [Dropdowns](https://dev.xena.biz/xena-developer/user-interface/styleguide/dropdowns.md): Dropdowns are used as menus or shortcuts.
- [Forms](https://dev.xena.biz/xena-developer/user-interface/styleguide/forms.md): Build forms for user inputs.
- [Icons](https://dev.xena.biz/xena-developer/user-interface/styleguide/icons.md): We use the solid style of Font Awesome 5 icons.
- [Layout](https://dev.xena.biz/xena-developer/user-interface/styleguide/layout.md): How to build responsive layouts.
- [Modals](https://dev.xena.biz/xena-developer/user-interface/styleguide/modals.md): Modals can be used for dialogs, popups and alike.
- [Navigation](https://dev.xena.biz/xena-developer/user-interface/styleguide/navigation.md): There are different options for navigating in views.
- [Pagination](https://dev.xena.biz/xena-developer/user-interface/styleguide/pagination.md): Styles of paginations in tables and panels.
- [Panels](https://dev.xena.biz/xena-developer/user-interface/styleguide/panels.md): Panels are sections in the interface.
- [Tables](https://dev.xena.biz/xena-developer/user-interface/styleguide/tables.md): Present and edit data in tables.
- [Other components](https://dev.xena.biz/xena-developer/user-interface/styleguide/components.md): There are different components in Xena that have their own set of CSS classes.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://dev.xena.biz/xena-developer/user-interface/styleguide.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.
