<button class="button">
  <span class="button__icon">ICON 1</span>
  <span class="button__text">TEXT 1</span>
</button>

<button class="button button_dark">
  <span class="button__icon">ICON 1</span>
  <span class="button__text">TEXT 1</span>
</button>

<button class="button2">
  <span class="button2__icon">ICON 2</span>
  <span class="button2__text">TEXT 2</span>
</button>

<button class="button2 button2_red">
  <span class="button2__icon">ICON 2</span>
  <span class="button2__text">TEXT 2</span>
</button>
.button {
  background: #fff;
}

.button_dark {
  background: #ccc;
}

.button2_red {
  background: #cc3366;
}

.button2 {
  background: #90919d;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.