<nav class="nav"> <div><a class="nav__brand" href="#">Navbar</a></div> <div class="nav__links"> <ul class="nav__list"> <li class="nav__item"> <a class="nav__link" aria-current="page" href="#">Home</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> </ul> <ul class="nav__list"> <li class="nav__item"> <a class="nav__link" href="#"> <span>SignIn</span> <i class="ri-user-line"></i> </a> </li> <li class="nav__item"> <a class="nav__link" aria-current="page" href="#"> <span> WishList </span><i class="ri-heart-line"></i> </a> </li> <li class="nav__item"> <a class="nav__link" href="#"><span>Cart</span> <i class="ri-shopping-cart-2-line"></i> </a> </li> </ul> </div> </nav>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter