Frontend Development + PHP, Javascript & React

Sharing Is Caring: LESS Mixins Edition

By:

Natalie Miller

on 12/3/2018

One of the major perks of using CSS preprocessors is the ability to create your own mixins. Mixins are essentially functions you can write in LESS (or SCSS) to dynamically output CSS code. There are also a number of LESS and SCSS mixin libraries that you can download for use, but I thought I’d share some we find useful.

Quick Button Styles


“>

Make a Font Awesome Icon


“>

Build a Path to your Own Icons


“>

Easy 2x Images for Retina Displays


“>

Center a Container with a Max-Width


“>

Make Screen Reader Exclusive Content


“>

Feel free to play around with these in your code. Once you get a hang of making your own – mixins are sure to speed up your workflow!

Share to

Related Posts

Dive into the Sanity Structure Builder

By: Mark Biek on 6/13/2021

Sanity is the super fast, super customizable CMS that we're using as the backend for the new via.studio website. One of the more powerful concepts that Sanity is the ​Structure Builder which gives you the ability to customize how content is presented in the Sanity admin.

Read More »
Email
Email @ 50: Email Development
Email @ 50: Email Development

By:Nick Stewart on 8/6/2021

Email development has always been the bane of a web developer's existence. You have to use outdated methods and don't have access to the full modern web to create a nice looking email that thousands of people will see. It's like asking a Nascar mechanic to create a car using only tools from the 90s - it can be done but its more than a pain.

Read More »