# Type Scale Calc

Generate a fluid typography scale based on a few inputs.

## Find out how it works

Everything is based on math. If you want a full breakdown, check out this guy: Aleksandr Hovhannisyan - Fluid type scale

He also has his own fluid type scale calculator, that is probably better than this one, but I needed a bit more flexibility in the scales.

### Quick maths

Calculate slope

```
m = (maxFontSize - minFontSize) / (maxBreakpoint - minBreakpoint)
e.g.: m = (19px - 16px) / (1000px - 400px) = 1/20 = 0.005
```

Calculate y-intercept (b)

```
y = mx + b
16px = 0.005(400px) + b
b = y - mx
b = 16px - 0.005(400px) = 16px - 2px = 14px
```

Calculate preferred value

`preferredValue = y = mx + b = 0.005(x) + 14px`

Multiply slope by 100 and use vw

`font-size: clamp(16px, 0.5vw + 14px, 19px);`