Icons by Feather Icons

Alert

Woah! Who goes there? This is a serious button for serious people who need to alert other people to things that might be going on. That's right. See that over there? It's dangerous and that's why we need a big red button so we can tell you about it.

Change what the button says:

HTML

<div class="html_button btn-left">
    <a href="#" class="btn alert large">Your button text here</a>
</div>

CSS

.alert {
    padding:1em 2em;
    border-radius:0.5em;
    color:black;
    font-weight:bold;
    background:#ff9c9c;
    border-bottom:0.55em solid #ed5d5d;
    transition:0.3s;
}
.alert:hover {
    background:#ff5f5f;
    border-bottom:0.55em solid #eb0707; 
    transition:0.3s;
}

Check out the docs for a full installation and how-to guide for HTML Buttons.