Digital Style Guide

Welcome to the digital style guide for your brand.

Buttons #

Default

(↓) Download | </> Show code

<button>Default button</button>

<!-- Alternatively, the below class can be added to an element
     <a href="#" class="button">Default button</a>
-->

Grey

(↓) Download | </> Show code

<button class="button--grey">Grey button</button>

Disabled

(↓) Download | </> Show code

<button disabled>Disabled button</button>
<button class="button--grey" disabled>Disabled button</button>

Context

(↓) Download | </> Show code

<div class="panel bg--red">
    <div class="inner">
        <button>Default button</button>
        <button class="button--grey">Grey button</button>
        <button disabled>Disabled button</button>
    </div>
</div>