Generated by SassMeister.com.

SassMeister-input.scss

// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----

$animations: (
  'fade-in': (
    0%: (
      opacity: 0
    ),
    100%: (
      opacity: 1
    )
  ),
  'fade-flicker': (
    0%: (
      opacity: 1
    ),
    30%: (
      opacity: 0
    ),
    60%: (
      opacity: 1
    ),
    78%: (
      opacity: 0
    ),
    100%: (
      opacity: 1
    )
  )
);

@mixin keyframe-gen($name) {
  @keyframes #{$name} {
    @each $position, $change in map-get($animations, $name) {
      #{$position} {
        @each $prop, $val in $change {
          #{$prop}: #{$val};
        }
      }
    }
  }
};

$included-animations: ();

@mixin animate($name, $duration: 2s, $timing: ease-in) {
  $exists: index($included-animations, '#{$name}');
  @if not $exists {
    @at-root {
      @include keyframe-gen($name);
    }
    $included-animations: append($included-animations, '#{$name}') !global;
  }

  animation: $name $duration $timing;
};

img {
  @include animate('fade-in');
}

SassMeister-output.css

img {
  animation: "fade-in" 2s ease-in;
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}