The Versoly navbar element enables you to create responsive navbars with dropdowns. It also comes with a UI to easily add extra links and edit the content of those links.
<nav class="navbar sticky top-0 bg-white" id="navbar">
<div class="container">
<a class="navbar-brand" href="#">
<img width="30" height="" src="https://d1pnnwteuly8z3.cloudfront.net/images/dafc1e05-b0e8-4c6d-b375-4a62333bbd5a/2f7d47af-ad93-480c-a98c-5085f3c724c8.png" />
<span>Ipsum</span>
</a>
<button class="navbar-btn" data-toggle="collapse" data-target="#navbar-row" aria-expanded="false" aria-label="Toggle navigation">
<div class="h-1 mt-3 rounded-full bg-primary"></div>
<div class="h-1 mt-1 rounded-full bg-primary"></div>
<div class="h-1 mt-1 rounded-full bg-primary"></div>
</button>
<div class="navbar-row" id="navbar-row">
<ul class="navbar-col"></ul>
<ul class="navbar-col"></ul>
<ul class="navbar-col">
<li>
<a class="btn btn-ghost btn-primary btn-link-primary" href="/#">Pricing</a>
</li>
<li>
<a class="btn btn-ghost btn-primary btn-link-primary" href="#">Login</a>
</li>
<li>
<a class="btn btn-primary" href="#">Get Started Now</a>
</li>
</ul>
</div>
</div>
</nav>