> For the complete documentation index, see [llms.txt](https://iron-network.gitbook.io/reactify/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://iron-network.gitbook.io/reactify/reactify-redux-thunk-saga/ui-components/chip.md).

# Chip

You can add the component on any page in the template. You need to follow the steps given below: 

**Step 1:** Please add the code given below in the page where you want to add the component.

```
<Chip className="bg-warning text-white mr-10 mb-10" label="Basic Chip" />
```

**Step 2:** Now Import the component from its parent library.

```
import Chip from '@material-ui/core/Chip'
```

We have given you an example of adding a default chip on the Ecommerce Dashboard.

![](https://3423697845-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LEnOfkACC-WsXr2rO7I%2F-LbwUY4w4XhkK6MIXG7o%2F-LbwUpMZoamoZabg100m%2FSelection_032.png?alt=media\&token=c214a218-3d02-407f-9735-ff02488c1a5f)

You can check some other chip layouts below. For adding any of the below layout in the template, please check their relative code in the `src->routes->components->chip->index.js` file.

![](https://3423697845-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LEnOfkACC-WsXr2rO7I%2F-LbvF3BajKyaP0dTOUPN%2F-LbvFF5Wvea8p1OH97FH%2FScreenshot%202019-04-08%20at%2010.11.47%20AM.png?alt=media\&token=310283db-3f48-4f19-9e43-bc186ec96ed6)