You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
As the name of FluidMS suggests, it serves as a combination of fluid typography and Modular Scale. However, there might be projects that just don’t need/want the Modular Scale approach but still want fluid typography. So instead of deciding for one ratio value that determines the scale, maybe each entity of the scale needs to be determined individually.
I could imagine that the FluidMS settings will then look something like this:
$FLUIDMS-CONFIG: (
min-font-size: 16px, // Still define a base font-size for small screen...max-font-size: 24px, // ...and for large screen.min-viewport: 480px,
max-viewport: 1280px,
ratio: false, // Disable the ratio.// Alter the default Sass list to a map, so we can assign// (rem-)values to the individual scale entities.scales: (
6: 3rem,
5: 2.5rem,
4: 2rem,
3: 1.7rem,
2: 1.4rem,
1: 1.2rem-1: 0.8rem,
-2: 0.65rem,
-3: 0.55rem,
),
) !default;
This way, we’d still have fluid typography, but we can define the font-sizes of the individual font-size scale entities individually (i.e. breaking the Modular Scale).
The text was updated successfully, but these errors were encountered:
As the name of FluidMS suggests, it serves as a combination of fluid typography and Modular Scale. However, there might be projects that just don’t need/want the Modular Scale approach but still want fluid typography. So instead of deciding for one ratio value that determines the scale, maybe each entity of the scale needs to be determined individually.
I could imagine that the FluidMS settings will then look something like this:
This way, we’d still have fluid typography, but we can define the font-sizes of the individual font-size scale entities individually (i.e. breaking the Modular Scale).
The text was updated successfully, but these errors were encountered: