# Dashboards & Widgets

- [HTML Canvas](https://dev.ubidots.com/dashboards-and-widgets/html-canvas.md): Build your own custom widgets with the HTML Canvas
- [Third-party packages](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/3rd-party-packages.md)
- [Preload Dashboard data](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/preload-dashboard-data.md): This feature makes the dashboard data available for the user at load time.
- [Built-in library](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/built-in-library.md)
- [Properties](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/built-in-library/properties.md): This page describes the HTML Canvas class properties.
- [Methods](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/built-in-library/methods.md): This page describes the available methods within the HTML Canvas class
- [Listening events](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/built-in-library/listening-events.md): Access dashboard settings via event handlers
- [API](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/built-in-library/api.md): Access the Ubidots JavaScript SDK from HTML Canvas
- [Examples](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/examples.md)
- [Basics](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/examples/basics.md)
- [Create an LCD screen with the HTML Canvas](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/examples/create-an-lcd-screen-with-the-html-canvas.md)
- [Interacting with dashboard data](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/examples/interacting-with-dashboard-data.md)
- [Change the header's custom style](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/examples/change-headers-custom-style.md): This example shows how to dynamically change a widget's header style when a user clicks a button in the HTML Canvas widget.
- [Adding real time using Socket.IO](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/examples/adding-real-time-using-socket.io.md): Using the socket.IO library, create a simple real-time widget with Ubidots and the HTML Canvas.
- [Delete variable data from a device](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/examples/delete-variable-data-from-a-device.md): Learn how to use an HTML Canvas widget to delete variable data from a device within a selected time window in Dynamic Dashboards.
- [Delete Variable data from Device Groups or Types](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/examples/delete-variable-data-from-groups-or-types-of-devices.md): Use this example to build an HTML Canvas widget that lets you select a variable label, choose a time window, and delete the matching data.
- [Navigation through Dashboard](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/examples/navigation-through-dashboard.md): This example uses the HTML Canvas "Preload dashboard data" feature to implement dashboard navigation.
- [Using a React library](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/examples/using-a-react-library.md): This example shows how to import and use Material UI.
- [Code editor](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/code-editor.md)
- [HTML Tab](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/code-editor/html-tab.md)
- [CSS Tab](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/code-editor/css-tab.md)
- [JavaScript Tab](https://dev.ubidots.com/dashboards-and-widgets/html-canvas/code-editor/javascript-tab.md)
- [Custom UI](https://dev.ubidots.com/dashboards-and-widgets/custom-ui.md): This article covers the Custom UI widget, its features, and how to use it.
- [Paragraph](https://dev.ubidots.com/dashboards-and-widgets/custom-ui/paragraph.md): Displays headings or paragraphs depending on the \`type\` property.
- [Input combo](https://dev.ubidots.com/dashboards-and-widgets/custom-ui/input-combo.md): Displays an input field based on the \`type\` property.
- [Text](https://dev.ubidots.com/dashboards-and-widgets/custom-ui/input-combo/text.md): Use text inputs within Custom UI widget
- [Numeric](https://dev.ubidots.com/dashboards-and-widgets/custom-ui/input-combo/numeric.md): Use numeric input fields within the Custom UI widget
- [Numeric with buttons](https://dev.ubidots.com/dashboards-and-widgets/custom-ui/input-combo/numeric-with-buttons.md): Use numeric input fields with buttons within the Custom UI widget
- [Date](https://dev.ubidots.com/dashboards-and-widgets/custom-ui/input-combo/date.md): Use date input fields within the Custom UI widget
- [Time](https://dev.ubidots.com/dashboards-and-widgets/custom-ui/input-combo/time.md): Use time input fields within the Custom UI widget
- [Toggle](https://dev.ubidots.com/dashboards-and-widgets/custom-ui/input-combo/toggle.md): Use toggle buttons in the Custom UI widget
- [Dropdown](https://dev.ubidots.com/dashboards-and-widgets/custom-ui/input-combo/dropdown.md): Use dropdown lists in the Custom UI widget
- [Multiple selection dropdown](https://dev.ubidots.com/dashboards-and-widgets/custom-ui/input-combo/multiple-selection-dropdown.md): Use multiple selection dropdown lists in the Custom UI widget
- [Button](https://dev.ubidots.com/dashboards-and-widgets/custom-ui/button.md): This element displays a button whose color reflects its status based on its type.
- [Custom Style](https://dev.ubidots.com/dashboards-and-widgets/custom-style.md): Customize your App beyond the branding level with the Custom Style editor for Dashboards and Widgets
- [Dashboards](https://dev.ubidots.com/dashboards-and-widgets/custom-style/dashboards.md)
- [Widgets](https://dev.ubidots.com/dashboards-and-widgets/custom-style/widgets.md)
- [Line Chart](https://dev.ubidots.com/dashboards-and-widgets/line-chart.md): Visualize time series data in Ubidots with the Line Chart widget
- [Gauge](https://dev.ubidots.com/dashboards-and-widgets/gauge.md): Visualize single-value data in Ubidots in the form of Gauge charts


---

# 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.ubidots.com/dashboards-and-widgets.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.