elf-notes/sass/design/_scales.scss

/* @link https://utopia.fyi/type/calculator?c=320,12,1.2,1024,24,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l|xs-m */


:root {
  --step--2: clamp(0.52rem, calc(0.47rem + 0.23vw), 0.64rem);
  --step--1: clamp(0.63rem, calc(0.56rem + 0.34vw), 0.80rem);
  --step-0: clamp(0.75rem, calc(0.65rem + 0.49vw), 1.00rem);
  --step-1: clamp(0.90rem, calc(0.76rem + 0.68vw), 1.25rem);
  --step-2: clamp(1.08rem, calc(0.89rem + 0.94vw), 1.56rem);
  --step-3: clamp(1.30rem, calc(1.04rem + 1.28vw), 1.95rem);
  --step-4: clamp(1.56rem, calc(1.21rem + 1.73vw), 2.44rem);
  --step-5: clamp(1.87rem, calc(1.40rem + 2.31vw), 3.05rem);
  --half-step-0: calc(clamp(0.75rem, calc(0.58rem + 0.85vw), 1.13rem) / 2);
}

/* @link https://utopia.fyi/space/calculator?c=320,12,1.2,1024,24,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l|xs-m */

:root {
  --space-3xs: clamp(0.19rem, calc(0.16rem + 0.12vw), 0.25rem);
  --space-2xs: clamp(0.38rem, calc(0.33rem + 0.24vw), 0.50rem);
  --space-xs: clamp(0.56rem, calc(0.49rem + 0.37vw), 0.75rem);
  --space-s: clamp(0.75rem, calc(0.65rem + 0.49vw), 1.00rem);
  --space-m: clamp(1.13rem, calc(0.98rem + 0.73vw), 1.50rem);
  --space-l: clamp(1.50rem, calc(1.30rem + 0.98vw), 2.00rem);
  --space-xl: clamp(2.25rem, calc(1.96rem + 1.46vw), 3.00rem);
  --space-2xl: clamp(3.00rem, calc(2.61rem + 1.95vw), 4.00rem);
  --space-3xl: clamp(4.50rem, calc(3.91rem + 2.93vw), 6.00rem);

  /* One-up pairs */
  --space-3xs-2xs: clamp(0.19rem, calc(0.07rem + 0.61vw), 0.50rem);
  --space-2xs-xs: clamp(0.38rem, calc(0.23rem + 0.73vw), 0.75rem);
  --space-xs-s: clamp(0.56rem, calc(0.39rem + 0.85vw), 1.00rem);
  --space-s-m: clamp(0.75rem, calc(0.46rem + 1.46vw), 1.50rem);
  --space-m-l: clamp(1.13rem, calc(0.78rem + 1.71vw), 2.00rem);
  --space-l-xl: clamp(1.50rem, calc(0.91rem + 2.93vw), 3.00rem);
  --space-xl-2xl: clamp(2.25rem, calc(1.57rem + 3.41vw), 4.00rem);
  --space-2xl-3xl: clamp(3.00rem, calc(1.83rem + 5.85vw), 6.00rem);

  /* Custom pairs */
  --space-s-l: clamp(0.75rem, calc(0.26rem + 2.44vw), 2.00rem);
  --space-xs-m: clamp(0.56rem, calc(0.20rem + 1.83vw), 1.50rem);
  --space-3xs-l: clamp(0.19rem, calc(-0.52rem + 3.54vw), 2.00rem);
}