simple LESS mixin for typographic scales

ratio.less

// Based on the work of Tim Brown from http://alistapart.com/article/more-meaningful-typography

@fontRatioBase: 16; //In pixels
@fontRatioScale: 1.618;

.font-rem(@size) {
	font-size: @size * @fontRatioBase * 1px;
	font-size: @size * 1rem;
}

.font-scale(@index, @base: @fontRatioBase, @scale: @fontRatioScale) {
	font-size: pow(@scale, @index) * 1rem;
	font-size: @base * pow(@scale, @index) * 1px;
}

.font-scale-double(@index, @base: @fontRatioBase, @scale: @fontRatioScale) {
	font-size: pow(@scale, @index) * 2rem;
	font-size: @base * pow(@scale, @index) * 2px;
}

/* Usage */

html {
	font-size: @fontRatioBase * 1px;
	line-height: 1.35;
}

h1 {
	.font-scale(1); // 25.888px
}

p {
	.font-scale(0); // 16px
}