# Navigation Style

We have included eight navigation styles in the Crema. You can choose the Navigation style according to your choice and requirement by following under-written steps.

**Changing Navigation Style in run time:-**

Click on the settings button on the right corner of the screen just below the notification icon, a drawer will open in which you will find navigation styles option and from there, you can navigation style of your choice.

**Changing Navigation Style in development mode (setting default Navigation Style):-**

To set the default Navigation Style, go to the following file:-

```
src/@crema/utility/ContextProvider/defaultConfig.js
```

In this file, you will find a property named 'navStyle' which accepts eighth values. You need to set the value of 'navStyle' according to your choice. Layouts and their accepted values(which you have to assign to 'navStyle') can be found in the file with path:-

```
src/shared/constants/AppEnums.js
```

Layouts and their schematic designs are as follows:-

1\. Default Layout           

                                  ![](https://gblobscdn.gitbook.com/assets%2F-LzcESYFYdNFkCg00g4w%2F-M-6AHl0ZG2GZIDCISRE%2F-M-6D_jdSgjZg1WCsshS%2Fnav2.png?alt=media\&token=c6a852ab-386b-415d-97d3-ba01c092eae2)

 2\. Standard Layout          

                                  ![](https://gblobscdn.gitbook.com/assets%2F-LzcESYFYdNFkCg00g4w%2F-M-6AHl0ZG2GZIDCISRE%2F-M-6FLhRkKjeK-Bjjk5n%2Fnav4.png?alt=media\&token=0ab337e4-d6d2-498d-873a-73d6b0fc6c34)

3\. Mini Layout                     

                                  ![](https://gblobscdn.gitbook.com/assets%2F-LzcESYFYdNFkCg00g4w%2F-M-6AHl0ZG2GZIDCISRE%2F-M-6FQixu4ibrw0pJxp2%2Fnav3.png?alt=media\&token=e2abe0a5-a7ed-4846-a7af-7e3cdf9e8e44)

4\. Drawer Layout       

                                  ![](https://gblobscdn.gitbook.com/assets%2F-LzcESYFYdNFkCg00g4w%2F-M-6AHl0ZG2GZIDCISRE%2F-M-6FV6DuwNAyQ27SFzd%2Fnav1.png?alt=media\&token=6ff666f2-9db2-4c00-a64a-9705b398b77d)

5\. Bit Bucket Layout 

                                  ![](https://gblobscdn.gitbook.com/assets%2F-LzcESYFYdNFkCg00g4w%2F-M-6AHl0ZG2GZIDCISRE%2F-M-6Fb2UeGmkAgNvZmU8%2Fnav5.png?alt=media\&token=83314c16-94b7-44b5-bb36-22c0c5b63770)

6\. Horizontal Default Layout

                                  ![](https://gblobscdn.gitbook.com/assets%2F-LzcESYFYdNFkCg00g4w%2F-M-6AHl0ZG2GZIDCISRE%2F-M-6FgrwuyH49N1Y27FT%2Fnav6.png?alt=media\&token=396d66c1-3088-434f-b48f-2b79c00bd98a)

7\. Horizontal Light Navigation Layout

                                 ![](https://gblobscdn.gitbook.com/assets%2F-LzcESYFYdNFkCg00g4w%2F-M-6AHl0ZG2GZIDCISRE%2F-M-6FlAGwwSfhRGGouRG%2Fnav8.png?alt=media\&token=8d03470a-2a21-4dad-9aad-dcc237cacb03)

8\. Horizontal Dark Navigation Layout

                                 ![](https://gblobscdn.gitbook.com/assets%2F-LzcESYFYdNFkCg00g4w%2F-M-6AHl0ZG2GZIDCISRE%2F-M-6FoeyBcAQZoKGaooZ%2Fnav7.png?alt=media\&token=266f5458-1ec8-404c-b56b-5692b76beb5b)


---

# 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.cremawork.com/v2.0/customization/navigation-style.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.