Typography
Section header
H1 Header
H2 Header
H3 Header
H4 Header
H5 Header
H6 Header
Section Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Mauris pharetra et ultrices neque ornare. Sed viverra tellus in hac habitasse platea dictumst vestibulum. Nunc sed augue lacus viverra vitae congue eu consequat ac.
Turpis massa tincidunt dui ut ornare lectus sit amet est. Adipiscing vitae proin sagittis nisl rhoncus mattis. Integer vitae justo eget magna fermentum iaculis eu. Elit pellentesque habitant morbi tristique.
Colors
Buttons and links
Form controls
Tabs
<section class="tabs tabs--small"> <div class="tabs__header">First item</div> <div class="tabs__content">Content I</div> <div class="tabs__header">Second item</div> <div class="tabs__content">Content II</div> </section>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Mauris pharetra et ultrices neque ornare. Sed viverra tellus in hac habitasse platea dictumst vestibulum. Nunc sed augue lacus viverra vitae congue eu consequat ac.
Turpis massa tincidunt dui ut ornare lectus sit amet est. Adipiscing vitae proin sagittis nisl rhoncus mattis. Integer vitae justo eget magna fermentum iaculis eu. Elit pellentesque habitant morbi tristique.
<section class="tabs tabs--simple"> <div class="tabs__header">First item</div> <div class="tabs__content">Content I</div> <div class="tabs__header">Second item</div> <div class="tabs__content">Content II</div> </section>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Mauris pharetra et ultrices neque ornare. Sed viverra tellus in hac habitasse platea dictumst vestibulum. Nunc sed augue lacus viverra vitae congue eu consequat ac.
Turpis massa tincidunt dui ut ornare lectus sit amet est. Adipiscing vitae proin sagittis nisl rhoncus mattis. Integer vitae justo eget magna fermentum iaculis eu. Elit pellentesque habitant morbi tristique.
<section class="tabs tabs--wide"> <div class="tabs__header">First item</div> <div class="tabs__content">Content I</div> <div class="tabs__header">Second item</div> <div class="tabs__content">Content II</div> </section>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Mauris pharetra et ultrices neque ornare. Sed viverra tellus in hac habitasse platea dictumst vestibulum. Nunc sed augue lacus viverra vitae congue eu consequat ac.
Turpis massa tincidunt dui ut ornare lectus sit amet est. Adipiscing vitae proin sagittis nisl rhoncus mattis. Integer vitae justo eget magna fermentum iaculis eu. Elit pellentesque habitant morbi tristique.