<button class="ss-button">
  BUTTON
</button>
<hr/>
<button class="ss-btn">
  BTN
</button>

<hr/>
<button class="ss-btn outline">
  BTN
</button>

<hr/>
<button class="ss-btn ss-sand">
  Sand Text
</button>
<hr/>
<button class="ss-btn ss-hvr-sand">
  Sand Text
</button>
<hr/>
<button class="ss-btn ss-bg-sand">
  Sand Background
</button>
<hr/>
<button class="ss-btn ss-hvr-bg-sand">
  Sand Background
</button>


<hr/>
<button class="ss-btn ss-bd-sand">
  Black Border
</button>
<hr/>
<button class="ss-btn ss-hvr-bd-sand">
  Black Border
</button>
<hr/>
<button class="ss-btn ss-white ss-bg-black">BTN with White Text & Black Background</button>
<hr/>
<button class="ss-btn ss-white ss-bg-green">BTN with White Text & Green Background</button>
<hr/>
<button class="ss-button ss-white ss-bg-black">BUTTON with White Text & Black Background</button>
<hr/>
<button class="ss-button ss-white ss-bg-green">BUTTON with White Text & Green Background</button>
Run Pen

External CSS

  1. https://cdn.jsdelivr.net/gh/shoaiyb/css@master/sysa.css

External JavaScript

This Pen doesn't use any external JavaScript resources.