little Helpers

Little helpers sind kleine Tools, die dir die Arbeit erleichtern sollen. Besonders einfach ist die Umrechnung von absoluten auf relative Font-Größen.

Little helpers is a small collection of tools, that will help you getting things done. I especially build this to calculate relative font-sizes.

Features #

• convert pixel to (r)em
• easily copy/paste results
• calculate percentages
• calculate conversions
• instant feedback during input

Why I built this #

Calculating font-sizes is a recurring task for frontend developers. Many developers use websites specifically designed for this purpose.

For this type of conversion, Zach Leatherman created a workflow using text expander. I really liked the idea but I'm a mega supporter of Alfred, so I wanted to build on top of that. You can get the worflow for Alfred on github

The workflow worked very fine on my private device but on a company device you are usually not allowed to install own software, so I've built a website specifically for converting font-sizes. I wanted a super easy way to copy/paste values and select between rem and em-values.

• Since the default font-size is 16px the base-calculation is based on this value.
• A checkbox toggles between em and rem
• there is a copy function
• you will also get a comment you can paste in your css

So the output looks like this and can simply be copied into your CSS, SCSS, LESS or whatever:

.75rem; /*-- 12px / 16px --*/

In the meantime I've added some additional calculations as well.