<div class="alert alert-colored alert-success"> <i class="far fa-check-circle"></i> Success! You are good to go </div> <!-- this can be turned into border model by replacing alert-colored with alert-border --> <div class="alert alert-colored alert-error"> <i class="fas fa-times"></i> Error! Please try again </div> <div class="alert alert-colored alert-warning"> <i class="fas fa-exclamation"></i> Warning! Please review the data </div> <div class="alert alert-border alert-warning"> <i class="far fa-check-circle"></i> Success! You are good to go </div>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter