gistfile1.scss

/*
    Following this suggestion by @aral:
    https://twitter.com/#!/aral/status/161833507423916032 and
    https://twitter.com/#!/aral/status/161833979736096769

    I realised that a CSS Pre-processor could help save some time here if you
    use the same values for px and rem.

    This works in SCSS: 
*/

@mixin font_size($size) {
    font-size: #{$size}px;
    font-size: #{$size}rem;
}

/* Usage
*/

html {
    font-size: 1px;
}

    body {
        @include font_size(16); // 16px/rem
    }

    h1 {
        @include font_size(24); // 24px/rem
    }