<nav>
<a class='inline-flex btn color-blue color-white-on-active bg-transparent bg-darken10-on-hover bg-blue-on-active txt-s ml3 is-active' href='#'>
<svg class='icon txt-m mr6'><use xlink:href='#icon-home'/></svg> Home
</a>
<a class='inline-flex btn color-blue color-white-on-active bg-transparent bg-darken10-on-hover bg-blue-on-active txt-s ml3' href='#'>
<svg class='icon txt-m mr6'><use xlink:href='#icon-user'/></svg> Account
</a>
<a class='inline-flex btn color-blue color-white-on-active bg-transparent bg-darken10-on-hover bg-blue-on-active txt-s ml3' href='#'>
<svg class='icon txt-m mr6'><use xlink:href='#icon-logout'/></svg> Logout
</a>
</nav>
<div class='bg-gray border-b border--black flex h40 txt-bold txt-s'>
<button class='mb-neg1 px12 py6 border-b border--black border--white-on-active color-lighten50 color-white-on-active color-lighten75-on-hover'>One</button>
<button class='mb-neg1 px12 py6 border-b border--black border--white-on-active color-lighten50 color-white-on-active color-lighten75-on-hover is-active'>Active</button>
<button class='mb-neg1 px12 py6 border-b border--black border--white-on-active color-lighten50 color-white-on-active color-lighten75-on-hover'>Two</button>
</div>
<div class='bg-darken75 color-white px12 py12'>
Changing content
</div>
<div class='inline-flex flex--center-cross txt-s'>
<a href='#' class='link link--darken50'>One</a>
<svg class='icon'><use xlink:href='#icon-caret-right'/></svg>
<a href='#' class='link link--darken50'>Two</a>
<svg class='icon'><use xlink:href='#icon-caret-right'/></svg>
<span class='txt-bold'>Three</span>
</div>