<!-- _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-0 is-serif has-text-dark">Biings Design System</span>
                <hr class="is-smaller">
                <div class="subtitle is-4 has-text-grey-darker">The single source of truth for building Biings products</div>
                <hr class="is-small">
                <a href="#/?id=main" class="button is-medium is-dark is-beefy is-outlined">Start exploring</a>
                <a href="https://www.npmjs.com/package/biings-ds" class="button is-medium is-text is-beefy"><img src="https://img.shields.io/npm/v/biings-ds.svg" alt="biings-ds"></a>
                <hr>
                
            </div>
        </div>
    </div>
</div>
