Responsively resizing fonts (to keep their size near constant relative to viewport size)

responsive-fonts.less

.font-mediaqueries (@width-min; @width-max; @font-min; @font-max) when (@width-min < @width-max) {
    @media only screen and (min-width: round(@width-min)) {
        body {
            font-size: @font-min;
        }
    }

    @font-next: @font-min + 1px;
    @slope: unit(@width-max - @width-min) / unit(@font-max - @font-min);
    @width-next: (unit(@width-min) + @slope) * 1px;

    .font-mediaqueries(@width-next; @width-max; @font-next; @font-max);
}

.font-mediaqueries(360px, 768px, 10px, 20px);