Skip to content

Instantly share code, notes, and snippets.

@amalichev
Last active March 6, 2022 15:29
Show Gist options
  • Save amalichev/9dbf16facf90b9c54233d4564a327b2b to your computer and use it in GitHub Desktop.
Save amalichev/9dbf16facf90b9c54233d4564a327b2b to your computer and use it in GitHub Desktop.
adaptive-font()
$layout-width: 1280;
@mixin adaptive-font($lg-size: 16, $xs-size: 14, $xs-screen: 320) {
$add-size: $lg-size - $xs-size;
$max-width: $layout-width - $xs-screen;
font-size: calc(#{$xs-size + px} + #{$add-size} * ((100vw - #{$xs-screen + px}) / #{$max-width}));
}
// h1 { @include adaptive-font(32, 24); }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment