You can use these variables to customize this component. Simply set one or multiple of these variables before importing Bulma. Learn how.
You are viewing the deprecated 0.5.0 version of the website. Click here to view the latest version
Documentation
Everything you need to create a website with Bulma
<aside class="menu">
<p class="menu-label">
General
</p>
<ul class="menu-list">
<li><a>Dashboard</a></li>
<li><a>Customers</a></li>
</ul>
<p class="menu-label">
Administration
</p>
<ul class="menu-list">
<li><a>Team Settings</a></li>
<li>
<a class="is-active">Manage Your Team</a>
<ul>
<li><a>Members</a></li>
<li><a>Plugins</a></li>
<li><a>Add a member</a></li>
</ul>
</li>
<li><a>Invitations</a></li>
<li><a>Cloud Storage Environment Settings</a></li>
<li><a>Authentication</a></li>
</ul>
<p class="menu-label">
Transactions
</p>
<ul class="menu-list">
<li><a>Payments</a></li>
<li><a>Transfers</a></li>
<li><a>Balance</a></li>
</ul>
</aside>You can use these variables to customize this component. Simply set one or multiple of these variables before importing Bulma. Learn how.
| Name | Default value |
|---|---|
| Name | Default value |
$menu-item-color
|
$text
|
$menu-item-radius
|
$radius-small
|
$menu-item-hover-color
|
$text-strong
|
$menu-item-hover-background-color
|
$background
|
$menu-item-active-color
|
$link-invert
|
$menu-item-active-background-color
|
$link
|
$menu-list-border-left
|
1px solid $border
|
$menu-label-color
|
$text-light
|
This page is open source. Noticed a typo? Or something unclear? Improve this page on GitHub
Bulma Partners
Check out their products!