My SVG workflow, from awkward to simple

Initially I thought it would be quite frustrating to get going with SVG, but after jumping in and seeing where I got it’s quite simple. Much better than exporting 1x and 2x images by far.

Understanding Sass default variables

Sass has a handy feature to create default variables using !default in the same way you would use !important. Why is this handy? Well you can use them to manipulate the default values of a mixin, remove or add certain bits of code based…

Using em’s for efficiency

There are a lot of CSS frameworks out there that are great, but their biggest flaw to me is their insistence to override styles and not use a relative measurement like em’s to adjust the styles when needed. I realise a lot of the way…

Create a fluid browser with border-image

I have been curious to try find a solution to having a fluid browser around portfolio images. I have attempted to find a solution which is as simple as I have been able to find. The overall idea uses :before to apply the browser…

Compass mixins you should know about

Compass is a brilliant extension to Sass as we all know. We know the time saving CSS3 related mixins it offers, maybe you don’t know some of the lesser praised mixins/functions that offer a similar convenience. I’m going to run through a few of my favourites…

Using scale-color in Sass

I have been recently trying to get a consistent look across my element mixin no matter the colour, without being too inefficient. You could say simply take a base colour, and use darken and lighten on it, to get reasonable variations of the colour,…

Create a Sass button/element mixin

This mixin is one I’ve been using for a few months now to create buttons/anything with a particular style. I call it an element mixin, as it’s not tied to anything. It started off as a plain button mixin, though I found sometimes I just want a…

Sass hints & tips

Sass/Compass are all the rage lately, well, CSS preprocessors in general. I have been planning to share my knowledge for a while and now feels a good time. This could be a biased approach but I can’t really see a downside to using a preprocessor, when…

Get article updates

Subscribe to the newsletter and you’ll be updated when new articles are posted. You will receive highlights & takeaways by email to read when you’re ready.