My collection of SCSS (SASS) mixins that I find myself using more often than not.

ASOH-Mixins.scss

// Adapted from - http://pivotallabs.com/bulletproof-font-face-syntax-with-sass/
@mixin declare-font-face($font-family, $font-filename, $font-path: '.', $font-weight: normal, $font-style: normal, $font-stretch: normal) {
  @font-face {
    font-family: '#{$font-family}';
    src: url('#{$font-path}/#{$font-filename}.eot');
    src: url('#{$font-path}/#{$font-filename}.eot?#iefix') format('embedded-opentype'),
         url('#{$font-path}/#{$font-filename}.woff') format('woff'),
         url('#{$font-path}/#{$font-filename}.ttf') format('truetype'),
         url('#{$font-path}/#{$font-filename}.svg##{$font-family}') format('svg');
    font-weight: $font-weight;
    font-style: $font-style;
    font-stretch: $font-stretch; }
}

// Easily style those pesky hyperlinks
@mixin link-style($color) {
  a {
    color: $color;
    text-decoration: none;
    &:link, &:visited { color: $color; }
    &:hover, &:active { color: scale-color($color, $lightness: -20%); } }
}

// Rounded Corners
@mixin border-radius($radius) {
  -webkit-border-radius: $radius;
  -mox-border-radius: $radius;
  border-radius: $radius;
  background-clip: padding-box;  /* stops bg color from leaking outside the border: */
}

// Box Shadows
@mixin box-shadow($top, $left, $blur, $color, $inset: false) {
  @if $inset {
    -webkit-box-shadow:inset $top $left $blur $color;
    -moz-box-shadow:inset $top $left $blur $color;
    box-shadow:inset $top $left $blur $color;
  } @else {
    -webkit-box-shadow: $top $left $blur $color;
    -moz-box-shadow: $top $left $blur $color;
    box-shadow: $top $left $blur $color;
  }
}

// Linear gradients
@mixin gradient($from, $to) {
  background: -webkit-gradient(linear, left top, left bottom, from($from), to($to));
  background: -moz-linear-gradient(top,  $from, $to);
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#{$from}', endColorstr='#{$to}');
}

// CSS3 Animations
@mixin keyframes($name) {
  @-webkit-keyframes #{$name} {
    @content; 
  }
  @-moz-keyframes #{$name} {
    @content;
  }
  @-ms-keyframes #{$name} {
    @content;
  }
  @-o-keyframes #{$name} {
    @content;
  }
  @keyframes #{$name} {
    @content;
  } 
}
@mixin animation($do) {
  -webkit-animation: unquote($do);
  -moz-animation: unquote($do);
  -ms-animation: unquote($do);
  -o-animation: unquote($do);
  animation: unquote($do);
}

// https://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/index.html 
//
// grayscale      ex: filter: grayscale(100%);
// sepia          ex: filter: sepia(100%);
// saturate       ex: filter: saturate(0%);
// hue-rotate     ex: filter: hue-rotate(45deg);
// invert         ex: filter: invert(100%);
// brightness     ex: filter: brightness(15%);
// contrast       ex: filter: contrast(200%);
// blur           ex: filter: blur(2px);
 
@mixin filter($filter-type,$filter-amount) { 
  -webkit-filter: $filter-type+unquote('(#{$filter-amount})');
  -moz-filter: $filter-type+unquote('(#{$filter-amount})');
  -ms-filter: $filter-type+unquote('(#{$filter-amount})');
  -o-filter: $filter-type+unquote('(#{$filter-amount})');
  filter: $filter-type+unquote('(#{$filter-amount})');
}