Sass each sample

sass-icon-list.scss

@mixin size($width, $height: $width) {
  width: $width;
  height: $height;
}

@mixin display($display, $align: false) {
  display: $display;
  @if $align {
    vertical-align: $align;
  }
}

$icons: (
  home:     'home-icon',
  bio:      'bio-icon',
  gallery:  'gallery-icon',
  works:    'works-icon',
  contact:  'contact-icon',
  hire:     'hire-icon'
);

@each $id, $url in $icons {
  .icon-#{$id} {
    @include size(36px);
    @include display(inline-block, bottom);

    &::after {
      @include size(100%);
      background: {
        image: url(../images/#{$url}.svg);
        repeat: no-repeat;
        position: center;
        size: contain;
      };
      content: "";
    }
  }
}