!
Info! This is an informative message
X
!
Info! This is an informative message
X
!
Info! This is an informative message
X

<div class="alert">
  <div class="alert__icon">
    !
  </div>
  <div class="alert__message">
    <strong>Info!</strong> This is an informative message
  </div>
  <div class="alert__close">
    X
  </div>
</div>
<div class="alert alert--success">
  <div class="alert__icon">
    !
  </div>
  <div class="alert__message">
    <strong>Info!</strong> This is an informative message
  </div>
  <div class="alert__close">
    X
  </div>
</div>
<div class="alert alert--danger">
  <div class="alert__icon">
    !
  </div>
  <div class="alert__message">
    <strong>Info!</strong> This is an informative message
  </div>
  <div class="alert__close">
    X
  </div>
</div>