Go ProSign in

This Lesson is for Members

Subscribe today and get access to all lessons! Plus direct HD download for offline use, enhances transcripts, member comment forums, and iTunes "podcast" RSS feed. Level up your skills now!

Unlock This Lesson

Already subscribed? Sign In

Autoplay
Hide playlist

    Automate SVG Sprite Background Image Variations with a SCSS Mixin

    n this lesson, you’ll learn how to write a SCSS mixin to generate styles for variations of background-images. We’ll look at using SCSS lists to interpolate dynamic class names and property attributes and output icons at different sizes.

    If you need the ability to add or edit icons on a regular basis, having a SCSS mixin do the heavy lifting of calculating background-position, background-size and creating selectors will save you lots of time and manual work.

    Note: this lesson assumes you have an understanding of SCSS, mixins and already have a process to compile SCSS.

    You must be a Member to view code