.icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  background-color: currentColor;
  --svg: url('../icons/file-invoice-dollar.svg');
}
.icon.size-lg {
  width: 90px;
  height: 90px;
}
.alarm-exclamation {
  --svg: url('../icons/alarm-exclamation.svg');
}
.at {
  --svg: url('../icons/at.svg');
}
.barcode {
  --svg: url('../icons/barcode.svg');
}
.basket-shopping-simple {
  --svg: url('../icons/basket-shopping-simple.svg');
}
.calendar-days {
  --svg: url('../icons/calendar-days.svg');
}
.check-circle {
  --svg: url('../icons/check-circle.svg');
}
.circle-user {
  --svg: url('../icons/circle-user.svg');
}
.clock-three {
  --svg: url('../icons/clock-three.svg');
}
.envelopes {
  --svg: url('../icons/envelopes.svg');
}
.file-invoice-dollar {
  --svg: url('../icons/file-invoice-dollar.svg');
}
.house-building {
  --svg: url('../icons/house-building.svg');
}
.lamp-street {
  --svg: url('../icons/lamp-street.svg');
}
.mailbox {
  --svg: url('../icons/mailbox.svg');
}
.map-marker-check {
  --svg: url('../icons/map-marker-check.svg');
}
.mobile-notch {
  --svg: url('../icons/mobile-notch.svg');
}
.popup-info {
  --svg: url('../icons/popup-info.svg');
}
.qr {
  --svg: url('../icons/qr.svg');
}
.traffic-light-slow {
  --svg: url('../icons/traffic-light-slow.svg');
}
.trash {
  --svg: url('../icons/trash.svg');
}
.triangle-warning {
  --svg: url('../icons/triangle-warning.svg');
}