Sass Mixin Library

Sass Mixin Library is a simple, lightweight, yet powerful mixin library for Sass.

Install using Git:

git clone https://github.com/brandonhimpfen/sass-mixin-library

Features

Here are the main features of the Sass Mixin Library:

• Simple to add to your project and use in your project;
• Adjust variables to your liking; and
• Save tons of time and typing.

Supported Mixins

Sass Mixin Library currently supports the following Sass mixins:

• Background gradients (top to bottom, left to right, gradient)
• Background opacity
• BEM front-end naming methodology
• Border
• Border image
• Border radius
• Breakpoints for responsive design
• Clearfix
• Font face
• Font size (rem)
• Height and width size
• Margin
• Padding
• Text shadow
• Vendor prefixes helpers

How-to Use

Copy the _mixins.scss file and mixins directory to your project. Add the following to your core file or file in which you want mixins to be added:

@import "mixins";

Example of implementation can be found in test.scss.

Example Output

Input:

.clearfix {
    @include clearfix;
}

Output:

.clearfix {
    *zoom: 1; 
}
.clearfix:before, .clearfix:after {
    content: " ";
    display: table;
}
.clearfix:after {
    clear: both;
}