Pattern Lab

HTML

									
										<p><a href="#" class="btn">Button</a></p>
<p><a href="#" class="btn-alt">Alternate Button</a></p>
<p><a href="#" class="btn disabled">Disabled Button</a></p>
<p><a href="#" class="text-btn">Text Button</a></p>

Tabs Alt

HTML

									
										<ul class="nav tabs">
    <li><a class="tab-alt tab-alt--active" href="#">Active</a></li>
    <li><a class="tab-alt" href="#">Passive</a></li>
    <li><a class="tab-alt" href="#">Passive</a></li>
</ul>

Tabs With Search

HTML

									
										<ul class="bare-list nav tabs">
    <li><a class="tab tab--active" href="#">Active</a></li>
    <li><a class="tab" href="#">Passive</a></li>
    <li><a class="tab" href="#">Passive</a></li>
    <li class="tabs__search"><a href="#"><i class="icon-search"></i></a></li>
</ul>

Tabs

HTML

									
										<ul class="bare-list nav tabs">
    <li><a class="tab tab--active" href="#">Active</a></li>
    <li><a class="tab" href="#">Passive</a></li>
    <li><a class="tab" href="#">Passive</a></li>
</ul>

Button Group

HTML

									
										<div class="btn-group">
    <button class="btn">Button</button>
    <button class="btn">Button</button>
</div>
<hr />
<div class="btn-group">
    <button class="btn">Button</button>
    <button class="btn">Button</button>
    <button class="btn">Button</button>
</div>

Buttons

HTML

Tabs Alt

HTML

Tabs With Search

HTML

Tabs

HTML

Tags

HTML

Button Group

HTML