.root {
  display: inline-block;
  vertical-align: middle; /** center align when parent display is inline/inline-block **/
}

.icon {
  display: block;
  width: 100%;
  height: 100%;
}

/** Size variation */
.small {
  width: var(--space-xsmall);
  height: var(--space-xsmall);
}

.medium {
  width: var(--space-small);
  height: var(--space-small);
}

.large {
  width: var(--space-medium);
  height: var(--space-medium);
}