From http://www.emoticode.net/sass/css3-transform-rotate-scale-skew-translate.html

CSS3_Transform_Mixin.scss

MIXINS:
=========================================================
//CSS3 Animation  Delay and Duration with vendor-prefixes
@mixin animate-props ($delay: 1s, $duration: 1s, $mode: both) {
    -webkit-animation-delay    : $delay;
    -webkit-animation-duration : $duration;
    -webkit-animation-fill-mode: $mode;

    -ms-animation-delay        : $delay;
    -ms-animation-duration     : $duration;
    -ms-animation-fill-mode    : $mode;

    -moz-animation-delay       : $delay;
    -moz-animation-duration    : $duration;
    -moz-animation-fill-mode   : $mode;

    -o-animation-delay         : $delay;
    -o-animation-duration      : $duration;
    -o-animation-fill-mode     : $mode;

    animation-delay            : $delay;
    animation-duration         : $duration;
    animation-fill-mode        : $mode;
}

//CSS3 Animation name only with vendor-prefixes
@mixin animate-type($animation-name){
  -webkit-animation-name: $animation-name;
  -moz-animation-name   : $animation-name;
  -o-animation-name     : $animation-name;
  animation-name        : $animation-name;
}

//CSS3 Generate keyframes with vendor prefixes and contents
@mixin animate-sprite($animation-name) {
    @-webkit-keyframes $animation-name {
        @content;
    }
    @-moz-keyframes $animation-name {
        @content;
    }
    @-o-keyframes $animation-name {
        @content;
    }
    @keyframes $animation-name {
        @content;
    }
}

//CSS3 Transform mixins transform: rotate, scale, skew, translate
@mixin transform-rotate($val){
    @if($val != null){
        -webkit-transform: rotate($val + deg) ;
        -moz-transform   : rotate($val + deg) ;
        -o-transform     : rotate($val + deg) ;
        -ms-transform    : rotate($val + deg) ;
        transform        : rotate($val + deg) ;
    }
}
@mixin transform-scale($x:1, $y:1){
    -webkit-transform: scale($x, $y);
    -moz-transform   : scale($x, $y);
    -o-transform     : scale($x, $y);
    -ms-transform    : scale($x, $y);
    transform        : scale($x, $y);
}
@mixin transform-skew($x:0, $y:0){
    -webkit-transform: skew($x + deg, $y + deg) ;
    -moz-transform   : skew($x + deg, $y + deg) ;
    -o-transform     : skew($x + deg, $y + deg) ;
    -ms-transform    : skew($x + deg, $y + deg) ;
    transform        : skew($x + deg, $y + deg) ;
}
@mixin transform-translate($x, $y){
    @if($x != null){
        -webkit-transform: translateX($x);
        -moz-transform   : translateX($x);
        -o-transform     : translateX($x);
        -ms-transform    : translateX($x);
        transform        : translateX($x);
    }
    @if($y != null){
        -webkit-transform: translateY($y);
        -moz-transform   : translateY($y);
        -o-transform     : translateY($y);
        -ms-transform    : translateY($y);
        transform        : translateY($y);
    }
}

USAGE EXAMPLES: 
=========================================================
//general class to implement on to animated element
.animate-me{
    @include animate-props ($delay: 1s, $duration: 1s, $mode: both);
}

//fade-in animations
@include animate-sprite(fade-in){
    0% {
        @include opacity(0);
    }
    100% {
        @include opacity(1);
    }
}
.fade-in{
    @include animate-type(fade-in);
}
//fade-in-up
@include animate-sprite(fade-in-up){
    0% {
        @include opacity(0);
        @include transform-translate(null,20px);
    }
    100% {
        @include opacity(1);
        @include transform-translate(null,0);
    }
}

//slide-in-down
@include animate-sprite(slide-in-down){
    0% {
        @include opacity(0);
        @include transform-translate(null, -250px);
    }

    100% {
        @include transform-translate(null, 0);
    }
}