<nav class="header-component"> <div class="branding"> <div class="header-component-logo">Logo</div> <div>Name</div> </div> <div class="header-component-more"> <div class="subnav"> <button class="link"> Home <i class="fa fa-caret-down"></i> </button> <div class="subnav-content"> <div>Link1</div> <div>Link2</div> <div>Link2</div> </div> </div> <div class="subnav"> <button class="link"> About <i class="fa fa-caret-down"></i> </button> <div class="subnav-content"> <div>Link1</div> <div>Link2</div> <div>Link2</div> </div> </div> <div class="subnav"> <button class="link"> More <i class="fa fa-caret-down"></i> </button> <div class="subnav-content"> <div>Link1</div> <div>Link2</div> <div>Link2</div> </div> </div> </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