@pluralsight/ps-design-system-icon/dist/cjs/css/index.css

Design System component for icon ui

.psds-icon {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.psds-icon > svg {
  fill: currentColor;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.psds-icon--size-xsmall {
  height: 16px;
  width: 16px;
}
.psds-icon--size-small {
  height: 20px;
  width: 20px;
}
.psds-icon--size-medium {
  height: 24px;
  width: 24px;
}
.psds-icon--size-large {
  height: 48px;
  width: 48px;
}
.psds-icon--color-text-icon-high-on-dark > svg {
  fill: var(--ps-colors-text-icon-high-on-dark);
}
.psds-icon--color-text-icon-low-on-dark > svg {
  fill: var(--ps-colors-text-icon-low-on-dark);
}
.psds-icon--color-text-icon-high-on-light > svg {
  fill: var(--ps-colors-text-icon-high-on-light);
}
.psds-icon--color-text-icon-low-on-light > svg {
  fill: var(--ps-colors-text-icon-low-on-light);
}
.psds-icon--color-red > svg {
  fill: var(--ps-colors-red-6);
}
.psds-icon--color-blue > svg {
  fill: var(--ps-colors-blue-6);
}
.psds-icon--color-green > svg {
  fill: var(--ps-colors-green-6);
}
.psds-icon--color-yellow > svg {
  fill: var(--ps-colors-yellow-6);
}