iuap-design/snippets/examples/message/1-darkIcon/widget.html

UI Framework Used For Enterprise.

<div class="example">
    <div class="u-message dark u-mesnews active" >    
        <span class="u-msg-close fa fa-close"></span>
        <i class="fa fa-bell margin-r-10"></i>News!
    </div>
    <div class="u-message dark u-mesinfo active">
        <span class="u-msg-close fa fa-close"></span>
        <i class="fa fa-info-circle margin-r-10"></i>Info!
    </div>
    <div class="u-message dark u-messuccess active">    
        <span class="u-msg-close fa fa-close"></span>
        <i class="fa fa-check-circle margin-r-10"></i>Success!
    </div>
    <div class="u-message dark u-mesdanger active">
        <span class="u-msg-close fa fa-close"></span>
        <i class="fa fa-times-circle margin-r-10"></i>Danger!
    </div>
    <div class="u-message dark u-meswarning active">
        <span class="u-msg-close fa fa-close"></span>
        <i class="fa fa-warning margin-r-10"></i>Warning!
    </div>
</div>