I bookmarked it. Are you using bootstrap / foundation?
Tachyons is different, it doesn't give you components but single-purpose classes and a font-relative layouting system:
http://tachyons.io/docs/layout/spacing/
It takes a while getting used to the names, but after that it's just awesome that you don't have to think about padding, margin and font-size values anymore. Just slap "pa1" or "pa2" there and everything looks pretty.
From experience, your method is easier to think through, but later on it is more time consuming to modify a layout. pa1 and the like should be treated the same as magic numbers.
But having 7 rem-relative steps, that fit together makes the common use-case way easier: Joe: "I need more padding on this, so I use pa2 instead of pa1".
If you feel the urge to check your code base it's easy to write scripts that count the occurences of "pa1..pa7". It's not so easy if you have to take into account "padding: 1px", "padding: 20%", "padding: 3em" etc.