# Customisation

## Overview

This document provides the customisation details for DIGIT UI. Customisation can be classified broadly into two types -

1. Overriding the Component/Hooks/CSS
2. Overwriting the required changes directly into the Micro-ui-internals

## Overriding

Overriding involves making all customization changes exclusively within the micro-ui/web directory.

#### For CSS

Within the custom CSS module, define customized CSS using the same class name or ID. Afterward, publish the changes. Ensure to reference this custom CSS file in the index.html to reflect the modifications on the website.

```
<link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-css@1.5.22/dist/index.css" />
<link rel="stylesheet" href="https://unpkg.com/@egovernments/digit-ui-custom-css@0.2.6/dist/index.css" />// Some code
```

#### For Components/Hooks

For overriding any components, re-register the same component in the same name in the customization folder. The latest changes are reflected.

## Overwriting Changes

Overwriting involves directly modifying the micro-ui-internals directory. This is slightly more challenging method to incorporate changes. Make sure the docker file is updated as per the code below and includes the install-deps.sh script.

````
```
dockerfile

RUN cd web/ \
    && node envs.js \
    &&  ./install-deps.sh \
    && yarn install \
    && yarn build 
```
````

The workspace in the web/package.json should be updated as below:

````
```json
 "workspaces": [
    "micro-ui-internals/packages/libraries",
    "micro-ui-internals/packages/react-components",
```
````


---

# 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://docs.digit.org/platform/guides/developer-guide/ui-developer-guide/customisation.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.
