# Introduction

NUI is a library for [Anvil](https://anvil.works/) that allows you to build advanced and highly customised UI that is easier to control. It also includes an HTML converter that converts any HTML snippet into a customizable anvil form.

It offers the following benefits out of the box

{% stepper %}
{% step %}

### Customise Everything

NUI aims to allow users to customise everything about their UI as per their brand with as minimal effort as possible. All within the designer itself.
{% endstep %}

{% step %}

### Anvil Designer Friendly

NUI is designed to keep the workflow within the Anvil designer as much as possible
{% endstep %}

{% step %}

### Wider Range of Properties & Events

NUI components offer a wider range of properties and events, allowing you to have more control over your design. Still need more? That's also possible.
{% endstep %}

{% step %}

### Use CSS anywhere

Apply CSS directly from the designer (no roles required). Get more control by defining CSS for specific states (hover, focus, etc.), and create and toggle between reusable presets. Best part? You can define CSS rules within the designer in a simpler syntax.
{% endstep %}

{% step %}

### Better Structured HTML

NUI makes it easy to build properly structured pages with appropriate tags, making your apps more accessible and SEO-friendly
{% endstep %}

{% step %}

### HTML to NUI Converter

It comes with an HTML-to-NUI converter that lets you convert any HTML design into an Anvil form with NUI components you can actually edit and add functionality to. This means you can now easily add HTML templates or AI-generated HTML designs.
{% endstep %}

{% step %}

### Support for more Icons

NUI allows support for three popular libraries - Font Awesome, Material Icons, and Bootstrap Icons
{% endstep %}

{% step %}

### Easier integration with JS

Allows a more simplified approach for adding custom JS events or DOM manipulation
{% endstep %}
{% endstepper %}

### Clone the Dependency

{% embed url="<https://anvil.works/build#clone:3ACFHAQDBLLJX7FL=3N3YRJYIK4O23JVOG3HYCGPY>" %}

{% hint style="warning" %}
This Library is still in testing and may have issues. You can report them on the forum - <https://github.com/Divyesh06/nui-for-anvil/discussions>
{% endhint %}


---

# 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://nui-for-anvil.gitbook.io/nui/introduction.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.