# Themes

**Reactify** have 6 predefined themes which you can see under the `src->reducer->settings.js` file:

```
themes: [
	{
		id: 1,
		name: 'primary'
	},
	{
		id: 2,
		name: 'secondary'
	},
	{
		id: 3,
		name: 'warning'
	},
	{
		id: 4,
		name: 'info'
	},
	{
		id: 5,
		name: 'danger'
	},
	{
		id: 6,
		name: 'success'
	}
]
```

If you want to change the theme then you can copy the **theme** **id** & **name** from the above array and override the value of `activeTheme` in the same file as is given in the below screenshot:

![Active Theme](https://3423697845-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LEnOfkACC-WsXr2rO7I%2F-L_W5ZQWkpgvJ7dDN_ZX%2F-L_W8p8B5ycEPj3IKthq%2FSelection_010.png?alt=media\&token=84a53b60-6dbe-4247-bb99-e6fab1bab28f)

Now open the `Reactify->public->index.html` file and search for the body tag and add a class with the theme name and save the file. Check the given screenshot for more information:

![Added Class in Body Tag](https://3423697845-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LEnOfkACC-WsXr2rO7I%2F-L_W5ZQWkpgvJ7dDN_ZX%2F-L_WA4eM40FhMgrScCTn%2FSelection_011.png?alt=media\&token=59c2765c-fe1c-43d1-96ef-cd62b82c37bd)

If you want some other theme then you can pass there class like: theme-info etc.

That's all about the Theme's in the **Reactify** template.