Closed basham closed 9 years ago
Major Third (5/4 = 1.25
)
Perfect Fourth ( 4/3 = 1.333
)
Deciding upon Minor Third.
Results in roughly:
Scale | Font Size |
---|---|
-1 | 13px |
0 | 16px |
1 | 19px |
1.5 | 21px |
// http://modularscale.com
@ratio-MinorThird: 6/5;
@ratio-Scale: @ratio-MinorThird;
@ratio-Scale--05: percentage(pow(@ratio-Scale, 0.5));
@ratio-Scale--10: percentage(@ratio-Scale);
@ratio-Scale--15: percentage(pow(@ratio-Scale, 1.5));
@ratio-Scale--20: percentage(pow(@ratio-Scale, 2));
// Multiplicative inverse (reciprocal)
@ratio-Scale--05i: percentage(1/pow(@ratio-Scale, 0.5));
@ratio-Scale--10i: percentage(1/pow(@ratio-Scale, 1));
// Typographical scales
@scale-MinorThird: 6/5;
@scale-FontSize: @scale-MinorThird;
// Shrinking scale (inverse)
@scale-FontSize--10i: percentage(1/@scale-FontSize);
@scale-FontSize--05i: percentage(1/pow(@scale-FontSize, 0.5));
// Identity
@scale-FontSize--00: 100%;
// Growing scale
@scale-FontSize--05: percentage(pow(@scale-FontSize, 0.5));
@scale-FontSize--10: percentage(@scale-FontSize);
@scale-FontSize--15: percentage(pow(@scale-FontSize, 1.5));
@scale-FontSize--20: percentage(pow(@scale-FontSize, 2));
Minor Third (
6/5 = 1.2
)