> For the complete documentation index, see [llms.txt](https://tophivetheme.gitbook.io/vurox/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://tophivetheme.gitbook.io/vurox/components/breadcrumbs.md).

# Breadcrumbs

Vurox has basic breadcrumbs with some designs with ant design breadcrumbs

```jsx
import { 
	VuroxBreadcrumbs
} from 'Components/breadcrumbs'
```

Then

```jsx
<VuroxBreadcrumbs 
    pagename='Email' 
    links={
        [ 
            ['Home', '/', ''], 
            ['Application','/application'], 
            [ 'Email', '/mail', 'active'] 
        ]
    } 
/>
```

| Components Props | Value                                                                                                                                                                                                                                                                                                                                                                                            |
| ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **`pagename`**   | `(String)`Name of page.For example : Email                                                                                                                                                                                                                                                                                                                                                       |
| **`links`**      | <p><strong><code>(Array)</code> </strong>  Contains multidimensional array.</p><p>                      Values contained:</p><p>                             <strong><code>name</code></strong>: Name of the page/links</p><p>                             <strong><code>url</code></strong>,</p><p>                             <strong><code>active class</code></strong>: default: active</p> |

Also you can use breadcrumbs from ant design

```jsx
import {Breadcrumb} from 'antd';
```

```jsx
<Breadcrumb>
    <Breadcrumb.Item>Ant Design</Breadcrumb.Item>
    <Breadcrumb.Item>
        <a href="">Component</a>
    </Breadcrumb.Item>
    <Breadcrumb.Item overlay={menu}>
        <a href="">General</a>
    </Breadcrumb.Item>
    <Breadcrumb.Item>Button</Breadcrumb.Item>
</Breadcrumb>
```

>