Magic Unit
| Pixel value | Variable name | magic-unit-rem function | magic-unit function |
|---|---|---|---|
| 4px | $mu025 | magic-unit-rem(0.25) | magic-unit(0.25) |
| 8px | $mu050 | magic-unit-rem(0.5) | magic-unit(0.5) |
| 12px | $mu075 | magic-unit-rem(0.75) | magic-unit(0.75) |
| 16px | $mu100 | magic-unit-rem(1) | magic-unit(1) |
| 20px | $mu125 | magic-unit-rem(1.25) | magic-unit(1.25) |
| 24px | $mu150 | magic-unit-rem(1.5) | magic-unit(1.5) |
| 28px | $mu175 | magic-unit-rem(1.75) | magic-unit(1.75) |
| 32px | $mu200 | magic-unit-rem(2) | magic-unit(2) |
| 40px | $mu250 | magic-unit-rem(2.5) | magic-unit(2.5) |
| 48px | $mu300 | magic-unit-rem(3) | magic-unit(3) |
| 56px | $mu350 | magic-unit-rem(3.5) | magic-unit(3.5) |
| 64px | $mu400 | magic-unit-rem(4) | magic-unit(4) |
| 80px | $mu500 | magic-unit-rem(5) | magic-unit(5) |
| 96px | $mu600 | magic-unit-rem(6) | magic-unit(6) |
| 112px | $mu700 | magic-unit-rem(7) | magic-unit(7) |
| 128px | $mu800 | magic-unit-rem(8) | magic-unit(8) |
| 144px | $mu900 | magic-unit-rem(9) | magic-unit(9) |
| 160px | $mu1000 | magic-unit-rem(1.0) | magic-unit(1.0) |
| etc... | no more variables | magic-unit-rem(...) | magic-unit(...) |