Last Updated: February 25, 2016
· marbio

A @mixin for font replacement in SASS

I wrote this useful @mixin for replace or change the default font of a website.

// Variables - default font 
$defSize: 12px;
$defStyle: normal;
$defLetterSpacing: 0px;

// Change the font using parameters
@mixin switch-font( $family, $size: $defSize, $style: $defStyle, $lettSpacing: $defLetterSpacing ) {
    font-family: $family;
    font-style: $style;
    font-size: $size;
    letter-spacing: $lettSpacing;

All parameters are optional except the font-family.