Supercharging my css with Scss

92

At least an attempt. 😄 While Sass is still quite new for me, I am getting to know it better and better these days. The language really helps me to maintain my css files and write them as efficient as possible.

For a long time I relied on frameworks from others to create all the prototypes in html and css. But during the use of the frameworks I often made tweaks or wrote a lot of additional css to fit my own preferences.

Along the way I developed my own vision on how I would like to write css and maintain this on a large scale. Being inspired mostly by the BEM methodology and the Tailwind concept. I am now collecting all the standard utility classes and their sass formats in a repository.

In this way, I am working on my css / scss skills and a stable base for all my prototypes. You can find it here: https://github.com/marco-van-zomeren/scss-utilities

Profile picture Marco van Zomeren

About

Marco van Zomeren is a designer on a audio visual journey. Currently working full time at a company with several subsidiaries in the financial sector. Besides his day job he spends most of his spare time on producing electronic music. More...

Leave a Reply

Related

Get all Material design colors with SCSS and CSS variables

Today I tried an expiriment with translating the Material design colors to a SCSS map. It turned out quit usefull. While combining the colors with a lightness and alpha variable,…

Read more

Kleuren kiezen voor je website

Een van de eerste dingen die ik ben gaan doen voor het re-design van mijn website is het vaststellen van een kleurenpalet. Ik ben tot de kleuren gekomen naar aanleiding…

Read more

Customizing utility classes with Bootstrap

While working on a method of creating all kinds of utility classes by myself, I was doing research to all kinds of frameworks who do this. My top 3 css…

Read more

Example of utility first design

To demonstrate the power of a utility first approach I have made an first example. Here you can see with which html structure and classes you can create a simple…

Read more

Wacom Bamboo pen and touch Catalina fix

Recently I wanted to use my Wacom Bamboo Pen & Touch again, so I plugged it in… without any success. The driver didn’t support it. So after testing it for…

Read more

Make your website dark-mode ready

Today I looked into the option to prepare your website for the dark-mode user setting. By applying different css styles for the preferred dark mode, I was able to translate…

Read more