17Taking Mixins Further with Variables

So far, the idea of a mixin is pretty similar to what we came across in @extend—a set of attributes we apply somewhere else. With @extend, however, all values must stay the same. Mixins are more complex.

Mixins can include arguments (i.e., descriptors) that allow you to vary your values. Take the mixin we defined in the last task—blue_text. It has a set of attributes associated with it. What if you want the text size to be variable? You can easily include this in the mixin. Instead of putting a predefined font size, put $size (or whatever you wish to call it). Then, when naming your mixin, include the $size part in parentheses after the name.

When you want to use the mixin, include the argument after the ...

Get Pragmatic Guide to Sass now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.