Pixels to rem SCSS function

rems are arguably the best unit but aren't as easy to use as pixels. This function allows you to use pixels as you normally would but sent via as SCSS function. This not only lets you easily use rems instead of pixels but it means you can change the realtive size of all your fonts from a single setting.

/* Basis for rem function; increase/decrease to change sizes globally */
html { font-size: 100%; }

/* Function */
@function rem($pixels) {

    @return #{$pixels / 16px}rem;

}

/* Example usage */
.class { font-size: rem(18px); }