<!-- _coverpage.md -->

<div class="container">
    <div class="columns is-centered">
        <div class="column is-four-fifths is-gapless">
            <div class="box">
                <img src="media/bds.png" width="140" class="no-zoom"/>
                <hr class="is-invisible is-small"/>
                <span class="title is-1 has-text-weight-bold ">Biings <span class="has-text-weight-light">Design System</span></span>
                <hr class="is-small">
                <div class="subtitle is-4 has-text-grey-dark">The single source of truth for building Biings products</div>
                <hr>
                <a href="#/?id=main" class="button is-primary is-medium is-beefy">Explore the system</a>
            </div>
        </div>
    </div>
</div>

<!-- background color -->
![color](#f9f8fc)