# Chip

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

**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)
