ionic-framework/scss/_badge.scss

/**
 * Badges
 * --------------------------------------------------
 */

.badge {
  display: inline-block;
  min-width: 10px;
  padding: 3px 8px;
  font-size: $badge-font-size;
  font-weight: $badge-font-weight;
  color: $badge-color;
  line-height: $badge-line-height;
  vertical-align: baseline;
  white-space: nowrap;
  text-align: center;
  background-color: $badge-bg;
  border-radius: $badge-border-radius;

  &:empty {
    display: none;
  }
}

// Quick fix for labels/badges in buttons
.button .badge {
  position: relative;
  top: -1px;
}

.badge-primary {
  background-color: $primary;
}
.badge-secondary {
  background-color: $secondary;
}
.badge-tertiary {
  background-color: $tertiary;
}
.badge-positive {
  background-color: $positive;
}
.badge-calm {
  background-color: $calm;
}
.badge-assertive {
  background-color: $assertive;
}
.badge-balanced {
  background-color: $balanced;
}
.badge-energized {
  background-color: $energized;
}
.badge-royle {
  background-color: $royle;
}
.badge-pure {
  background-color: $pure;
}
.badge-subdued-light {
  background-color: $subdued-light;
}
.badge-subdued {
  background-color: $subdued;
}
.badge-subdued-dark {
  background-color: $subdued-dark;
}
.badge-dark {
  background-color: $dark;
}