Cacher is the code snippet organizer for pro developers

/* 
Максимальная ширина контейнера - 1280px
на ней размер заголовка должен быть 40px

минимальная ширина контейнера - 320px
на ней шрифт должен быть 24px

16 = 40 - 24 // разница, которая будет нивелироваться от ширины экрана
*/

h1{
  font-size: calc(24px + 16 * (100vw / 1280));
}

@media( max-width: 767px ) {
  h1{
    font-size: calc(24px + (16 + 16 * 0.7) * ((100vw - 320px) / 1280));
  }
}

/* Миксин для Sass  */
@mixin adaptiv-font($pcSize, $mobSize)
  $addSize: $pcSize - $mobSize
  $addMobSize: $addSize * 2.7
  @media (max-width: 767px)
    font-size: calc( #{$mobSize + px} + #{$addMobSize} * ((100vw - 320px) / #{$maxWidth} ));
  @media (min-width: 768px)
    font-size: calc( #{$mobSize + px} + #{$addSize} * (100vw / #{$maxWidth} ));