Preview:
<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>
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