<Docs title="Primary">
<Button tag="button" color="cherry">My button</Button>
<Button tag="button" color="pink">My button</Button>
<Button tag="button" color="red">My button</Button>
</Docs>
<Docs title="Secondary">
<Button variant="secondary" color="cherry">My button</Button>
<Button variant="secondary" color="pink">My button</Button>
<Button variant="secondary" color="red">My button</Button>
</Docs>
<Docs title="Tag" background="dark">
<div style="color: white;">
<Button tag="button" color="tag-white">My Tag</Button>
<Button tag="button" color="tag-red">My Tag</Button>
<Button tag="button" color="tag-transparent">My Tag</Button>
<Button tag="button" color="tag-gray">My Tag</Button>
</div>
</Docs>
<Docs title="Small">
<Button size="small">My button</Button>
</Docs>
<Docs title="As Link">
<Button href="#">My button</Button>
</Docs>
<Docs title="As span">
<Button tag="span">My button</Button>
</Docs>